/* Desktop recruitment hall. Mobile continues to use the dedicated mobile layout. */
@media(min-width:761px){
  .content[data-view="referrals"]{max-width:1320px;margin:0 auto;color:#eee1cc}
  .content[data-view="referrals"]>.page-title{min-height:190px;margin:0 0 18px;padding:30px 38px;display:flex;flex-direction:column;justify-content:flex-end;position:relative;overflow:hidden;border:1px solid #956f2c;background:linear-gradient(90deg,#13080be8 0%,#0810148f 58%,#070b0dea),url('/assets/realm-command-v1.png') center 36%/cover;box-shadow:inset 0 -85px 105px #030506d6,0 20px 48px #000a}
  .content[data-view="referrals"]>.page-title:before{content:"♟  RECRUITMENT HALL";margin-bottom:8px;color:#edbd4e;font:900 10px Arial;letter-spacing:2px;text-shadow:0 2px 5px #000}
  .content[data-view="referrals"]>.page-title:after{content:"BUILD YOUR ALLIANCE";position:absolute;right:35px;bottom:38px;padding:11px 16px;border:1px solid #b18538;background:#110d08d9;color:#f5d477;font:900 10px Arial;letter-spacing:1.4px;box-shadow:inset 3px 0 #e2ad39,0 7px 20px #0009}
  .content[data-view="referrals"]>.page-title .eyebrow{display:none}
  .content[data-view="referrals"]>.page-title h1{margin:0;color:#fff0d4;font:700 40px/1 Georgia,serif;text-shadow:0 4px 14px #000}
  .content[data-view="referrals"]>.page-title p{max-width:650px;margin:10px 0 0;color:#d0c4b1;font-size:13px}
  .content[data-view="referrals"]>.panel{overflow:hidden;border:1px solid #8c672b;border-radius:0;background:linear-gradient(145deg,#111719f5,#070b0dfa);box-shadow:0 24px 60px #000b}
  .content[data-view="referrals"]>.panel>.panel-heading{height:68px;padding:0 25px;border-bottom:1px solid #745527;background:linear-gradient(90deg,#31150b,#131719 48%,#080d0f)}
  .content[data-view="referrals"]>.panel>.panel-heading h2{margin:0;color:#f7e3bc;font:700 23px Georgia,serif}
  .content[data-view="referrals"]>.panel>.panel-heading h2:before{content:"✦";display:inline-grid;width:34px;height:34px;margin-right:12px;place-items:center;border:1px solid #c19136;border-radius:50%;background:#211506;color:#f0c75b;font-size:16px;vertical-align:middle;box-shadow:0 0 14px #d29a2738}
  .content[data-view="referrals"] .padded{padding:25px 28px 22px;background:radial-gradient(circle at 12% 12%,#a2273522,transparent 30%)}
  .content[data-view="referrals"] .padded>p{margin:0 0 22px;padding:17px 20px;border:1px solid #5f4b2d;border-left:4px solid #d3a43c;background:#0c1113;color:#d2c7b5;font-size:14px;line-height:1.6}
  .content[data-view="referrals"] .padded>p b{color:#ffd36b;font-size:16px}
  .content[data-view="referrals"] .referral-invites{display:grid;grid-template-columns:minmax(0,1.55fr) 150px minmax(240px,.8fr) 150px;gap:10px;align-items:end}
  .content[data-view="referrals"] .referral-invites label{margin:0;color:#d5b767;font:900 9px Arial;letter-spacing:1.4px}
  .content[data-view="referrals"] .referral-invites input{height:52px;margin-top:8px;padding:0 16px;border:1px solid #65583d;background:#070c0f;color:#fff2d6;font:700 12px Arial;box-shadow:inset 0 0 18px #000}
  .content[data-view="referrals"] .referral-invites button{height:52px;border:1px solid #c18d2f;background:linear-gradient(#d4a83e,#966414);color:#160d03;font:900 11px Georgia,serif;letter-spacing:.5px;box-shadow:inset 0 1px #ffe99a,0 8px 16px #0008;cursor:pointer}
  .content[data-view="referrals"] .referral-invites button:hover{filter:brightness(1.12)}
  .content[data-view="referrals"] .mini-stats{margin-top:22px;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
  .content[data-view="referrals"] .mini-stats>div{min-height:90px;padding:17px 20px;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden;border:1px solid #5f5138;background:linear-gradient(135deg,#171d1f,#090e10);box-shadow:inset 4px 0 #ae7e26}
  .content[data-view="referrals"] .mini-stats>div:after{content:"";position:absolute;right:-20px;top:-28px;width:95px;height:95px;border:1px solid #d1a84b22;border-radius:50%}
  .content[data-view="referrals"] .mini-stats span{color:#aeb6b3;font:900 9px Arial;letter-spacing:1.3px}
  .content[data-view="referrals"] .mini-stats b{margin-top:5px;color:#f6ca61;font:700 27px Georgia,serif}
  .content[data-view="referrals"] .table-scroll{padding:0 28px 27px;background:#080d0f}
  .content[data-view="referrals"] table{width:100%;border-collapse:separate;border-spacing:0 8px}
  .content[data-view="referrals"] thead th{padding:12px 16px 5px;border:0;color:#9ca8aa;font:900 9px Arial;letter-spacing:1.3px;text-align:left;text-transform:uppercase}
  .content[data-view="referrals"] tbody tr{background:linear-gradient(90deg,#191d1d,#0d1315);box-shadow:inset 4px 0 #b88931,0 7px 18px #0007}
  .content[data-view="referrals"] tbody td{height:62px;padding:12px 16px;border-top:1px solid #344146;border-bottom:1px solid #344146;color:#dcd3c4}
  .content[data-view="referrals"] tbody td:first-child:before{content:"♟";display:inline-grid;width:32px;height:32px;margin-right:11px;place-items:center;border:1px solid #8f6a2d;border-radius:50%;color:#eec55d;vertical-align:middle}
  .content[data-view="referrals"] .text-link{border:0;background:none;color:#fff1d2;font:700 18px Georgia,serif;cursor:pointer}
  .content[data-view="referrals"] .text-link:hover{color:#f1c45b}
  .content[data-view="referrals"] tbody td:nth-child(2){color:#efc45a;font-weight:900}
}