.game-hub{position:relative}
.hub-community{position:absolute;top:0;left:0;z-index:500;max-width:min(520px,100%)}
.hub-social-row{display:flex;align-items:center;gap:8px}
.hub-bug-entry{margin-top:9px;max-width:330px}
.hub-bug-button{border:1px solid #bb8639;border-radius:9px;padding:8px 13px;color:#fff0c7;background:linear-gradient(#513516,#1d130b);box-shadow:0 7px 20px #0009;cursor:pointer;font-weight:bold}
.hub-bug-button:hover,.hub-bug-button:focus-visible{outline:2px solid #e8b341;outline-offset:2px}
.hub-bug-entry p{margin:5px 0 0;color:#f5deb0;font:12px/1.3 Arial,sans-serif;text-shadow:0 2px 4px #000}
.hub-social-row .friends-trigger{position:static;flex:none}
.hub-social-links{display:flex;align-items:center;gap:6px}
.hub-social-links a{display:grid;place-items:center;width:42px;height:42px;border:1px solid #bb8639;border-radius:9px;color:#fff0c7;background:linear-gradient(#513516,#1d130b);box-shadow:0 7px 20px #0009;text-decoration:none}
.hub-social-links a:hover,.hub-social-links a:focus-visible{color:#fff;box-shadow:0 0 14px #e8b341;outline:2px solid #e8b341;outline-offset:2px}
.hub-social-links svg{display:block;width:23px;height:23px}
.friends-trigger{position:absolute;top:0;left:0;z-index:500;pointer-events:auto;border:1px solid #bb8639;border-radius:9px;padding:12px 16px;color:#fff0c7;background:linear-gradient(#513516,#1d130b);box-shadow:0 7px 20px #0009;cursor:pointer;font-weight:bold;font-size:1rem}
.friends-trigger span:not(.friends-badge){margin-left:8px;color:#baddae;font: .8rem Arial,sans-serif}
.friends-badge{display:inline-grid;place-items:center;margin-left:8px;width:20px;height:20px;border-radius:50%;background:#a72424;color:white}
.friends-trigger.has-alert{animation:friends-pulse 1.4s ease-in-out infinite}
@keyframes friends-pulse{50%{box-shadow:0 0 24px 8px #e8b341}}
/* The atmosphere sheet gives every body child position:relative/z-index:2.
   This ID rule keeps the Friends dialog fixed above that shell. */
body > #friendsPanel.friends-overlay{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;padding:16px}
.friends-overlay-shade{position:absolute;inset:0;background:#000b}
.friends-dialog{position:relative;width:min(650px,100%);max-height:min(820px,92vh);overflow:auto;border:1px solid #c0913b;border-radius:16px;background:linear-gradient(150deg,#302013,#13100f);padding:28px;box-shadow:0 20px 70px #000;color:#f8e9c8}
.friends-dialog h2{margin:6px 0 18px;font-size:2rem}
.friends-close{position:absolute;right:17px;top:12px;border:0;background:transparent;color:#f6dba1;font-size:2rem;cursor:pointer}
.friends-tabs{display:flex;gap:7px;margin-bottom:18px;border-bottom:1px solid #806239;padding-bottom:10px}
.friends-tabs button,.friends-dialog button:not(.friends-close){border:1px solid #9b702c;border-radius:8px;background:#30200f;color:#f9e6b6;padding:9px 12px;cursor:pointer}
.friends-tabs button.selected,.friends-dialog button:hover{background:#81551d!important}
.friends-dialog button:disabled{opacity:.5;cursor:default}
#friendsStatus{min-height:1.2em;color:#eac47c;font: .9rem Arial,sans-serif}
.friend-row{display:flex;align-items:center;gap:12px;padding:10px;margin:8px 0;border:1px solid #6c512e;border-radius:9px;background:#201a15}
.friend-row.has-invite{box-shadow:0 0 12px #e8b341;border-color:#ebbc64}
.friend-row img,.friend-profile img{height:48px;width:48px;object-fit:cover;border:1px solid #b8893e;border-radius:5px;background:#17130e}
.friend-row-main{flex:1;min-width:0}
.friend-row-main strong{display:block;overflow-wrap:anywhere}
.friend-row-main small{display:block;color:#cdbd9c;font: .8rem Arial,sans-serif;margin-top:3px}
.friend-online{display:inline-block;width:10px;height:10px;margin-right:6px;border-radius:50%;background:#6bbd68}
.friend-offline{background:#777}
.friend-row-actions{display:flex;flex-wrap:wrap;gap:5px;justify-content:end}
.friend-empty{color:#bdaf94;font: .9rem Arial,sans-serif;padding:18px 0}
.friends-search-row{display:flex;gap:8px;margin:8px 0 16px}
.friends-search-row input{flex:1;min-width:0;padding:10px;background:#111719;border:1px solid #a88045;border-radius:7px;color:white;font:1rem Arial,sans-serif}
.friend-profile{position:relative;margin-top:15px;padding:18px;border:1px solid #c9963f;border-radius:10px;background:#101416}
.friend-profile-close{position:absolute;top:8px;right:8px;min-width:34px;min-height:34px;font-size:24px!important;line-height:1;cursor:pointer}
.friend-profile h3{overflow-wrap:anywhere}
.friend-profile-actions{display:flex;gap:7px;flex-wrap:wrap}
.mobile-pc-note{display:none}
body > #bugReportPanel.bug-report-overlay{position:fixed;inset:0;z-index:10020;display:grid;place-items:center;padding:16px}
.bug-report-shade{position:absolute;inset:0;background:#000c}
.bug-report-dialog{position:relative;width:min(600px,100%);max-height:90vh;overflow:auto;border:1px solid #c0913b;border-radius:16px;background:linear-gradient(150deg,#302013,#13100f);padding:28px;box-shadow:0 20px 70px #000;color:#f8e9c8}
.bug-report-dialog h2{margin:5px 0 10px;font-size:2rem}.bug-report-dialog p{line-height:1.45}
.bug-report-close{position:absolute;right:14px;top:10px;border:0;background:transparent;color:#f6dba1;font-size:2rem;cursor:pointer}
.bug-report-dialog label{display:block;margin:15px 0 7px;font-weight:bold}
.bug-report-dialog textarea{display:block;width:100%;min-height:180px;resize:vertical;padding:12px;border:1px solid #a88045;border-radius:8px;background:#111719;color:white;font:1rem/1.45 Arial,sans-serif}
.bug-report-actions{display:flex;justify-content:flex-end;margin-top:14px}
.bug-report-actions button{border:1px solid #e5b458;border-radius:8px;background:linear-gradient(#a77527,#513016);color:#fff4d9;padding:11px 18px;cursor:pointer;font-weight:bold}
.bug-report-actions button:disabled{opacity:.6;cursor:wait}
.bug-report-status{min-height:1.3em;color:#eac47c;font:14px/1.4 Arial,sans-serif}
@media(max-width:720px){
  .hub-community{position:relative;top:auto;left:auto;justify-self:stretch;width:100%;max-width:none}
  .hub-social-row{align-items:flex-start;gap:5px;min-width:0}
  .hub-bug-entry{max-width:none;margin:8px 0 0}
  .hub-social-row .friends-trigger{padding:10px 8px;font-size:14px}
  .friends-trigger span:not(.friends-badge){margin-left:4px;font-size:11px}
  .hub-social-links{gap:3px;flex:none}
  .hub-social-links a{width:32px;height:38px}
  .hub-social-links svg{width:19px;height:19px}
  .mobile-pc-note{display:block;position:static;flex:1;min-width:0;margin:0;padding:6px 4px;border:1px solid #bb8639;border-radius:8px;background:#1d130bd9;color:#f5deb0;font:10px/1.25 Arial,sans-serif;text-align:center}
  .friend-row{flex-wrap:wrap}.friend-row-actions{width:100%;justify-content:start}
}