/* LUDOPANDA_AAA_WEB_DESIGN_SYSTEM_V1 */
:root{
  --lp-bg:#050505;
  --lp-surface:#0d0d0d;
  --lp-surface-2:#121212;
  --lp-surface-3:#181818;
  --lp-border:rgba(255,255,255,.09);
  --lp-border-strong:rgba(255,212,0,.27);
  --lp-yellow:#FFD400;
  --lp-yellow-2:#FFEA70;
  --lp-gold:#D6A620;
  --lp-text:#FAFAF7;
  --lp-muted:#A3A3A3;
  --lp-soft:#737373;
  --lp-green:#69E38F;
  --lp-red:#FF6B68;
  --lp-shadow:0 28px 80px rgba(0,0,0,.34);
  --lp-shadow-soft:0 16px 44px rgba(0,0,0,.23);
  --lp-radius-xl:28px;
  --lp-radius-lg:22px;
  --lp-radius-md:16px;
  --lp-radius-sm:12px;
}
html{background:var(--lp-bg);color:var(--lp-text);color-scheme:dark}
body{
  min-height:100vh;
  background:
    radial-gradient(circle at 78% -12%,rgba(255,212,0,.105),transparent 34rem),
    radial-gradient(circle at -10% 34%,rgba(255,212,0,.035),transparent 28rem),
    var(--lp-bg);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
body:before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:.18;
  background-image:
    linear-gradient(rgba(255,255,255,.015) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.015) 1px,transparent 1px);
  background-size:32px 32px;
  mask-image:linear-gradient(to bottom,#000,transparent 70%);
}
a,button,input,select,textarea{font:inherit}
button,a{-webkit-tap-highlight-color:transparent}
button{touch-action:manipulation}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:3px solid rgba(255,212,0,.34)!important;
  outline-offset:2px!important;
}
input,select,textarea{
  min-height:48px;
  transition:border-color .16s ease,box-shadow .16s ease,background .16s ease,transform .16s ease;
}
input:focus,select:focus,textarea:focus{
  border-color:rgba(255,212,0,.65)!important;
  box-shadow:0 0 0 4px rgba(255,212,0,.08)!important;
}
.topbar{
  min-height:74px!important;
  background:rgba(5,5,5,.88)!important;
  border-bottom:1px solid var(--lp-border)!important;
  backdrop-filter:blur(22px) saturate(145%)!important;
  -webkit-backdrop-filter:blur(22px) saturate(145%)!important;
  box-shadow:0 10px 35px rgba(0,0,0,.16);
}
.brand,.brand:visited{color:var(--lp-text)!important}
.brand-mark,.mark{
  overflow:hidden;
  background:linear-gradient(145deg,#FFE66D,#FFC900 54%,#E3A100)!important;
  border:1px solid rgba(255,228,91,.45)!important;
  box-shadow:0 10px 28px rgba(255,199,0,.16)!important;
}
.brand-mark img,.mark img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}
.brand strong{font-weight:950!important;letter-spacing:-.02em}
.brand small{color:#8e8e8e!important}
.eyebrow{
  color:var(--lp-yellow)!important;
  font-weight:950!important;
  letter-spacing:.14em!important;
}
h1,h2,h3,strong{letter-spacing:-.015em}
.primary,.primary-btn{
  background:linear-gradient(145deg,var(--lp-yellow-2),var(--lp-yellow) 52%,#F2B800)!important;
  color:#090909!important;
  border:1px solid rgba(255,236,128,.72)!important;
  box-shadow:0 12px 26px rgba(255,199,0,.14),inset 0 1px 0 rgba(255,255,255,.28)!important;
  font-weight:950!important;
  transition:transform .14s ease,filter .14s ease,box-shadow .14s ease!important;
}
.primary:hover,.primary-btn:hover{filter:brightness(1.035);transform:translateY(-1px)}
.primary:active,.primary-btn:active{transform:translateY(1px) scale(.995)}
.ghost,.ghost-btn,.secondary,.secondary-btn{
  background:rgba(255,255,255,.035)!important;
  border:1px solid var(--lp-border)!important;
  color:var(--lp-text)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
}
.ghost:hover,.ghost-btn:hover,.secondary:hover,.secondary-btn:hover{
  border-color:rgba(255,212,0,.28)!important;
  background:rgba(255,212,0,.045)!important;
}
.hidden{display:none!important}
.toast{
  border:1px solid rgba(255,255,255,.12)!important;
  box-shadow:0 18px 50px rgba(0,0,0,.42)!important;
  backdrop-filter:blur(16px)!important;
}
@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}
}
@media(max-width:680px){
  body{background:radial-gradient(circle at 100% -8%,rgba(255,212,0,.09),transparent 27rem),var(--lp-bg)}
  .topbar{min-height:68px!important}
}

/* SUPPORT CENTER */
body{margin:0;padding-bottom:max(22px,env(safe-area-inset-bottom));font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.topbar{
  position:sticky;top:0;z-index:40;
  display:flex;align-items:center;justify-content:space-between;
  padding:max(12px,env(safe-area-inset-top)) 18px 12px;
}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none}
.brand-mark{width:44px;height:44px;border-radius:15px;display:grid;place-items:center;flex:0 0 auto}
.brand strong,.brand small{display:block}.brand strong{font-size:15px}.brand small{font-size:10px;margin-top:2px}
.top-actions{display:flex;gap:8px;align-items:center}
.ghost.small{min-height:38px;padding:0 12px;border-radius:12px;font-size:11px;font-weight:900}
.shell{width:min(100%,980px);margin:0 auto;padding:22px 18px 46px}
.hero{
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:center;
  padding:26px;border-radius:var(--lp-radius-xl);
  background:linear-gradient(145deg,rgba(25,25,25,.98),rgba(9,9,9,.99));
  border:1px solid var(--lp-border-strong);box-shadow:var(--lp-shadow);
  position:relative;overflow:hidden;
}
.hero:after{
  content:"";position:absolute;width:260px;height:260px;border-radius:50%;
  right:-110px;top:-155px;background:radial-gradient(circle,rgba(255,212,0,.22),transparent 68%);
  pointer-events:none
}
.hero h1{margin:7px 0 9px;font-size:clamp(28px,5vw,44px);line-height:1.02}
.hero p{margin:0;color:#b4b4b4;max-width:650px;line-height:1.55}
.hero-badge{
  position:relative;z-index:1;padding:11px 14px;border-radius:999px;
  color:#151000;background:linear-gradient(145deg,#FFE66D,#FFD400);
  font-size:10px;font-weight:1000;letter-spacing:.11em;box-shadow:0 12px 32px rgba(255,212,0,.15)
}
.search-card{margin-top:14px;padding:8px;border-radius:18px;background:#0c0c0c;border:1px solid var(--lp-border);box-shadow:var(--lp-shadow-soft)}
.search-card:before{content:"⌕";position:absolute}
.search-card input{width:100%;border:0!important;background:#121212!important;border-radius:13px!important;color:#fff;padding:0 16px!important;min-height:52px}
.pandabot-launch{margin-top:12px}
.pandabot-card{
  width:100%;display:flex;align-items:center;gap:14px;text-align:left;padding:16px 17px;
  border-radius:20px;border:1px solid rgba(255,212,0,.22);
  background:linear-gradient(145deg,#1c1708,#0e0e0e 54%,#090909);color:#fff;
  box-shadow:var(--lp-shadow-soft);cursor:pointer
}
.panda-avatar{width:48px;height:48px;border-radius:16px;display:grid;place-items:center;background:#FFD400;color:#090909;font-size:25px}
.panda-copy{min-width:0;flex:1}.panda-copy strong,.panda-copy small{display:block}.panda-copy strong{font-size:16px}.panda-copy small{color:#9a9a9a;margin-top:4px;font-size:11px}
.panda-online,.pandabot-status{color:var(--lp-green)!important;font-size:10px;font-weight:950;letter-spacing:.09em}
.actions-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:11px;margin-top:12px}
.action-card{
  min-height:132px;border:1px solid var(--lp-border);border-radius:20px;background:linear-gradient(145deg,#121212,#0b0b0b);
  color:#fff;padding:17px;text-align:left;cursor:pointer;box-shadow:var(--lp-shadow-soft);
  transition:transform .16s ease,border-color .16s ease,background .16s ease
}
.action-card:hover{transform:translateY(-2px);border-color:rgba(255,212,0,.30);background:linear-gradient(145deg,#17150d,#0b0b0b)}
.action-card .icon{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:rgba(255,212,0,.09);border:1px solid rgba(255,212,0,.15);color:var(--lp-yellow);font-size:22px;margin-bottom:14px}
.action-card strong,.action-card small{display:block}.action-card strong{font-size:14px}.action-card small{color:#858585;font-size:10.5px;margin-top:5px;line-height:1.35}
.panel{
  margin-top:14px;padding:20px;border-radius:24px;background:rgba(13,13,13,.96);
  border:1px solid var(--lp-border);box-shadow:var(--lp-shadow-soft)
}
.panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:15px}
.panel-head h2{margin:4px 0 0;font-size:22px}.panel-subtitle{margin:7px 0 0;color:#8f8f8f;line-height:1.45;font-size:12px}
.faq-list{display:grid;gap:9px}
.faq-list details,.public-help details{
  background:#111;border:1px solid var(--lp-border);border-radius:15px;overflow:hidden
}
.faq-list summary,.public-help summary{list-style:none;cursor:pointer;padding:14px 15px;font-weight:850;font-size:12px;color:#efefef}
.faq-list summary::-webkit-details-marker,.public-help summary::-webkit-details-marker{display:none}
.faq-list summary:after,.public-help summary:after{content:"＋";float:right;color:var(--lp-yellow);font-weight:900}
.faq-list details[open] summary:after,.public-help details[open] summary:after{content:"−"}
.faq-list p,.public-help p{margin:0;padding:0 15px 15px;color:#9b9b9b;font-size:11.5px;line-height:1.6}
.pandabot-status{display:inline-flex;align-items:center;gap:8px;border-radius:999px;background:rgba(105,227,143,.07);border:1px solid rgba(105,227,143,.16);padding:8px 10px}
.pandabot-status span{width:7px;height:7px;border-radius:50%;background:var(--lp-green);box-shadow:0 0 0 5px rgba(105,227,143,.08)}
.pandabot-conversation,.conversation{
  margin-top:12px;min-height:270px;max-height:54vh;overflow:auto;padding:14px;
  border:1px solid var(--lp-border);border-radius:18px;background:#090909;
  scrollbar-color:#3a3a3a transparent
}
.panda-message,.message{max-width:82%;margin:8px 0;padding:12px 14px;border-radius:17px;line-height:1.5;font-size:12px}
.panda-message.assistant,.message.support{background:#171717;border:1px solid rgba(255,255,255,.07);color:#ddd}
.panda-message.user,.message.player{margin-left:auto;background:#FFD400;color:#111}
.panda-message-name{font-size:9px;font-weight:950;letter-spacing:.08em;margin-bottom:4px;opacity:.7}
.message small{display:block;margin-top:6px;font-size:9px;opacity:.58}
.pandabot-quick{display:flex;gap:7px;overflow-x:auto;margin:11px 0;padding-bottom:2px}
.pandabot-quick button{flex:0 0 auto;border-radius:999px;border:1px solid var(--lp-border);background:#151515;color:#d4d4d4;padding:9px 11px;font-size:10px;cursor:pointer}
.pandabot-form,.reply-form{display:grid;grid-template-columns:1fr auto;gap:8px;margin-top:10px}
.pandabot-form input,.reply-form textarea,.form input,.form select,.form textarea{
  width:100%;border:1px solid var(--lp-border);background:#121212;color:#fff;border-radius:14px;padding:12px 13px
}
.reply-form textarea{min-height:56px;resize:vertical}
.primary{min-height:48px;border-radius:14px;padding:0 18px;cursor:pointer}
.wide{width:100%;justify-content:center;text-align:center}
.form{display:grid;gap:13px}.form label{color:#c1c1c1;font-size:11px;font-weight:850}.form label input,.form label select,.form label textarea{display:block;margin-top:7px}
.form textarea{resize:vertical;min-height:120px}.optional{color:#676767;font-weight:700}
.form-note,.return-hint{color:#707070;font-size:10px;line-height:1.5}
.ticket-list{display:grid;gap:9px}.ticket-row{border:1px solid var(--lp-border);border-radius:16px;background:#111;padding:14px;cursor:pointer}
.ticket-row:hover{border-color:rgba(255,212,0,.25)}
.ticket-top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.ticket-top strong{font-size:13px}.ticket-preview{color:#818181;font-size:10.5px;line-height:1.4;margin-top:7px}
.status{display:inline-flex;align-items:center;border-radius:999px;padding:6px 8px;background:#1b1b1b;color:#aaa;font-size:9px;text-transform:uppercase;font-weight:950;letter-spacing:.07em}
.status.open,.status.in_progress,.status.pending{color:var(--lp-yellow);background:rgba(255,212,0,.08)}
.status.resolved,.status.closed{color:var(--lp-green);background:rgba(105,227,143,.08)}
.unread{display:inline-grid;place-items:center;min-width:21px;height:21px;padding:0 5px;border-radius:999px;background:#FFD400;color:#111;font-size:9px;font-weight:1000}
.ticket-meta{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:10px;color:#777;font-size:10px}
.notice,.resolved-note{border:1px solid rgba(255,212,0,.14);background:rgba(255,212,0,.05);border-radius:14px;padding:12px 13px;color:#bdb7a6;font-size:11px;line-height:1.5}
.notice.error{border-color:rgba(255,107,104,.2);background:rgba(255,107,104,.06);color:#f2aaaa}
.auth-card{
  width:min(100%,620px);margin:7vh auto 0;padding:28px;border-radius:28px;
  background:linear-gradient(145deg,#131313,#090909);border:1px solid var(--lp-border-strong);box-shadow:var(--lp-shadow)
}
.auth-card h1{font-size:clamp(30px,6vw,48px);line-height:1.02;margin:7px 0 12px}.muted{color:#9e9e9e;line-height:1.6}
.public-help{margin-top:24px}.public-help h2{font-size:16px;margin:0 0 10px}
footer{text-align:center;color:#575757;font-size:10px;padding:18px 16px 30px}
@media(max-width:820px){.actions-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){
  .shell{padding:14px 12px 38px}.topbar{padding-left:12px;padding-right:12px}
  .hero{grid-template-columns:1fr;padding:20px}.hero-badge{width:max-content}
  .actions-grid{gap:8px}.action-card{min-height:116px;padding:14px}
  .panel{padding:16px;border-radius:20px}.pandabot-form,.reply-form{grid-template-columns:1fr}.pandabot-form .primary,.reply-form .primary{width:100%}
  .top-actions .game-return-link{display:none}.brand-mark{width:40px;height:40px}
}