/* ============================================================
   Inner-page redesigns (account, characters, redeem, empty states)
   ============================================================ */

/* ---- nice empty / inactive state ---- */
.rg-empty-state{ text-align:center; padding:38px 20px; }
.rg-empty-state .ico{ width:72px; height:72px; border-radius:50%; margin:0 auto 16px;
	display:flex; align-items:center; justify-content:center; font-size:30px; color:var(--cyan);
	background:linear-gradient(160deg,#2a3360,#12152b); border:1px solid var(--accent);
	box-shadow:inset 0 0 16px var(--shadow); }
.rg-empty-state h4{ color:#fff; margin:0 0 6px; font-weight:700; letter-spacing:.5px; font-size:18px; }
.rg-empty-state p{ color:var(--accent-2); margin:0; font-size:14px; }

/* ---- account page ---- */
.rg-acc-head{ display:flex; align-items:center; gap:16px; padding:18px; border-radius:12px;
	background:rgba(8,11,30,.5); border:1px solid var(--line); margin-bottom:16px; flex-wrap:wrap; }
.rg-acc-avatar{ width:62px; height:62px; border-radius:50%; flex-shrink:0; display:flex; align-items:center; justify-content:center;
	font-size:28px; color:var(--cyan); background:linear-gradient(160deg,#2a3360,#12152b); border:1px solid var(--accent); }
.rg-acc-info{ flex:1; min-width:150px; }
.rg-acc-info .name{ color:#fff; font-size:20px; font-weight:700; letter-spacing:.5px; }
.rg-acc-info .email{ color:var(--accent-2); font-size:13px; }
.rg-acc-coins{ display:flex; align-items:center; gap:11px; padding:11px 18px; border-radius:10px;
	background:linear-gradient(180deg,#46589e,#222a52); border:1px solid var(--accent); }
.rg-acc-coins i{ color:var(--gold); font-size:22px; }
.rg-acc-coins .v{ color:#fff; font-size:20px; font-weight:800; line-height:1; }
.rg-acc-coins .l{ color:#cfe0ff; font-size:11px; text-transform:uppercase; letter-spacing:.5px; }

.rg-acc-actions{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.rg-action{ display:flex; align-items:center; gap:12px; padding:12px 14px; border-radius:11px;
	background:rgba(8,11,30,.5); border:1px solid var(--line); color:var(--light) !important;
	text-decoration:none !important; transition:.2s; cursor:pointer; }
.rg-action:hover{ background:#1f2646; }
.rg-action .ai{ width:40px; height:40px; border-radius:9px; flex-shrink:0; display:flex; align-items:center; justify-content:center;
	font-size:17px; color:var(--cyan); background:linear-gradient(0deg,var(--panel-a),var(--panel-b)); border:1px solid var(--accent); }
.rg-action .at{ flex:1; min-width:0; }
.rg-action .at b{ display:block; color:#fff; font-size:14px; }
.rg-action .at small{ color:var(--accent-2); font-size:12px; }
.rg-action.is-danger{ border-color:rgba(180,87,122,.5); }
.rg-action.is-danger .ai{ color:#ff8aa6; border-color:#b4577a; }
.rg-action form{ margin:0; display:contents; }
.rg-action button{ background:none !important; border:none !important; box-shadow:none !important;
	padding:0 !important; margin:0 !important; color:inherit !important; font:inherit !important;
	display:flex; align-items:center; gap:12px; width:100%; text-align:left; cursor:pointer; }
@media (max-width:520px){ .rg-acc-actions{ grid-template-columns:1fr; } }

/* ---- character cards ---- */
.rg-chars{ display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:12px; }
.rg-char{ display:flex; align-items:center; gap:12px; padding:12px; border-radius:12px;
	background:rgba(8,11,30,.5); border:1px solid var(--line); border-left:3px solid var(--accent); }
.rg-char img{ width:52px; height:52px; border-radius:10px; flex-shrink:0; background:#0c1130; border:1px solid var(--line); object-fit:cover; }
.rg-char .ci{ min-width:0; flex:1; }
.rg-char .ci b{ display:block; color:#fff; font-size:15px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rg-char .ci .meta{ color:var(--accent-2); font-size:12px; }
.rg-char .ci .meta .lv{ color:var(--cyan); font-weight:700; }
.rg-char .ci .rk{ color:var(--gold); font-weight:700; font-size:11px; text-transform:uppercase; }
.rg-char .dbg{ margin-top:6px; }
.rg-char .dbg button{ padding:5px 12px; font-size:12px; border-radius:7px; border:1px solid var(--accent);
	background:linear-gradient(0deg,#1f2646,#2a3360); color:#fff; cursor:pointer; }
.rg-char .dbg button:hover{ filter:brightness(1.25); }

/* ---- redeem ---- */
.rg-redeem{ text-align:center; padding:6px 0 4px; }
.rg-redeem .ico{ width:72px; height:72px; border-radius:50%; margin:0 auto 14px;
	display:flex; align-items:center; justify-content:center; font-size:30px; color:var(--cyan);
	background:linear-gradient(160deg,#2a3360,#12152b); border:1px solid var(--accent); box-shadow:inset 0 0 16px var(--shadow); }
.rg-redeem h4{ color:#fff; margin:0 0 4px; font-weight:700; }
.rg-redeem p{ color:var(--accent-2); margin:0 0 16px; font-size:14px; }
.rg-redeem form{ display:flex; gap:10px; max-width:540px; margin:0 auto; flex-wrap:wrap; }
.rg-redeem input{ flex:1; min-width:180px; height:50px; padding:0 16px; border-radius:9px;
	background:rgba(8,11,30,.6) !important; border:1px solid var(--line) !important; color:#fff !important; outline:none; font-size:15px; }
.rg-redeem input:focus{ border-color:var(--accent) !important; }
.rg-redeem button{ height:50px; padding:0 22px; border-radius:9px; font-weight:700; letter-spacing:.5px; white-space:nowrap;
	border:1px solid var(--accent); background:linear-gradient(180deg,#46589e,#222a52); color:#fff; cursor:pointer; transition:.2s; }
.rg-redeem button:hover{ filter:brightness(1.18); }

/* ---- custom confirm modal ---- */
#rgModalOverlay{ position:fixed; inset:0; z-index:100000; display:none; align-items:center; justify-content:center;
	background:rgba(5,7,20,.78); -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px); }
#rgModalOverlay.rg-open{ display:flex; }
.rg-modal{ width:min(420px,92%); padding:26px; text-align:center; border-radius:14px;
	background:linear-gradient(0deg,#12152b,#1c2240); border:1px solid var(--accent);
	box-shadow:0 22px 60px rgba(0,0,0,.6), inset 0 0 26px rgba(0,0,0,.4); animation:rgPop .2s ease; }
@keyframes rgPop{ from{ transform:scale(.92); opacity:0; } to{ transform:scale(1); opacity:1; } }
.rg-modal-ico{ width:64px; height:64px; border-radius:50%; margin:0 auto 14px; display:flex; align-items:center; justify-content:center;
	font-size:26px; color:var(--cyan); background:linear-gradient(160deg,#2a3360,#12152b); border:1px solid var(--accent); box-shadow:inset 0 0 16px var(--shadow); }
.rg-modal-msg{ color:#fff; font-size:15px; line-height:1.55; margin-bottom:22px; }
.rg-modal-btns{ display:flex; gap:10px; justify-content:center; }
.rg-modal-btns button{ flex:1; max-width:160px; padding:12px; border-radius:9px; font-weight:700; letter-spacing:.5px;
	cursor:pointer; transition:.2s; font-size:14px; }
.rg-modal-ok{ color:#fff; border:1px solid var(--accent); background:linear-gradient(180deg,#46589e,#222a52); }
.rg-modal-ok:hover{ filter:brightness(1.2); }
.rg-modal-cancel{ color:var(--accent-2); border:1px solid var(--line); background:rgba(8,11,30,.5); }
.rg-modal-cancel:hover{ color:#fff; background:#1f2646; }

/* ---- auth forms (password reset, recovery, email) ---- */
.rg-form{ max-width:440px; margin:0 auto; }
.rg-form .rg-field{ margin-bottom:14px; }
.rg-form label{ display:block; color:var(--accent-2); font-size:13px; margin:0 0 6px; }
.rg-captcha-row{ display:flex; gap:12px; align-items:center; margin-bottom:14px; }
.rg-captcha-row img{ height:50px; border-radius:8px; border:1px solid var(--line); background:#fff; display:block; }
.rg-form .text-danger{ color:#ff8aa6; font-size:12px; margin:4px 0 0; }
