.account-page { --account-acid:#c9ff3d; --account-gold:#ffb53d; --account-blue:#59d8ff; --account-green:#50d89d; --account-red:#ff677b; --account-panel:#111620; --account-line:rgba(255,255,255,.09); background:#07090e; }
.account-page > .trending { display:none; }
.account-v2 { min-height:100vh; color:#dfe3dc; background:radial-gradient(circle at 82% 4%,rgba(255,181,61,.08),transparent 25%),#07090e; }
.account-hero { padding:155px 0 70px; border-bottom:1px solid var(--account-line); background:linear-gradient(130deg,#0b0e14,#121720); }
.account-hero-inner { display:flex; align-items:center; justify-content:space-between; gap:30px; }
.account-identity { display:flex; align-items:center; gap:20px; }
.account-avatar { position:relative; display:block; width:78px; height:78px; flex:0 0 auto; padding:3px; border-radius:22px; background:linear-gradient(135deg,var(--account-acid),var(--account-gold)); box-shadow:0 18px 45px rgba(0,0,0,.35); }
.account-avatar img { width:100%; height:100%; object-fit:cover; border:3px solid #10151d; border-radius:19px; }
.account-avatar i { position:absolute; right:-2px; bottom:-2px; width:17px; height:17px; border:4px solid #10151d; border-radius:50%; background:var(--account-green); }
.account-eyebrow { color:var(--account-acid); font-size:9px; font-weight:900; letter-spacing:.16em; text-transform:uppercase; }
.account-identity h1 { margin:5px 0 4px; color:#f6f7f3; font-size:clamp(30px,4vw,52px); font-weight:900; letter-spacing:-.05em; }
.account-identity p { margin:0; color:#747e8c; font-size:12px; }
.account-balance-card { min-width:235px; padding:17px 19px; border:1px solid rgba(201,255,61,.22); border-radius:15px; background:rgba(201,255,61,.045); }
.account-balance-card span { display:block; color:#737c88; font-size:8px; font-weight:850; letter-spacing:.08em; text-transform:uppercase; }
.account-balance-card strong { display:block; margin:5px 0 9px; color:#f2f4ee; font-size:24px; font-weight:900; }
.account-balance-card a { color:var(--account-acid); font-size:8px; font-weight:900; }
.account-balance-card a i { margin-left:4px; }
.account-workspace { padding:32px 0 70px; }
.account-summary-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-bottom:14px; }
.account-summary-grid article { display:grid; grid-template-columns:38px 1fr auto; align-items:center; gap:12px; min-height:84px; padding:15px 17px; border:1px solid var(--account-line); border-radius:13px; background:linear-gradient(145deg,#121720,#0d1118); }
.account-summary-grid article > i { display:grid; width:38px; height:38px; place-items:center; color:var(--account-acid); border-radius:10px; background:rgba(201,255,61,.07); }
.account-summary-grid article div { display:flex; flex-direction:column; }
.account-summary-grid span,.account-summary-grid small { color:#69727f; font-size:7px; font-weight:800; text-transform:uppercase; }
.account-summary-grid strong { color:#edf0e9; font-size:17px; font-weight:900; }
.account-summary-grid small { justify-self:end; text-transform:none; }
.account-tabs { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:7px; margin-bottom:14px; padding:7px; border:1px solid var(--account-line); border-radius:14px; background:#0d1118; }
.account-tabs button { display:flex; min-height:58px; align-items:center; gap:10px; padding:10px 13px; color:#737d89; border:1px solid transparent; border-radius:10px; background:transparent; text-align:left; }
.account-tabs button > i { display:grid; width:31px; height:31px; flex:0 0 auto; place-items:center; border-radius:8px; background:#171d26; font-size:11px; }
.account-tabs button span { display:flex; flex-direction:column; color:#c9ced5; font-size:9px; font-weight:900; }
.account-tabs button small { color:#59626e; font-size:6px; font-weight:700; }
.account-tabs button:hover { background:rgba(255,255,255,.025); }
.account-tabs button.active { color:#101609; border-color:rgba(201,255,61,.35); background:var(--account-acid); }
.account-tabs button.active > i { background:rgba(8,13,3,.12); }
.account-tabs button.active span,.account-tabs button.active small { color:#11170b; }
.account-panel { display:none; overflow:hidden; border:1px solid var(--account-line); border-radius:16px; background:linear-gradient(145deg,#121720,#0c1017); box-shadow:0 25px 75px rgba(0,0,0,.18); }
.account-panel.active { display:block; }
.account-panel-header { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:21px 23px; border-bottom:1px solid var(--account-line); }
.account-panel-header > div > span { color:var(--account-acid); font-size:7px; font-weight:900; letter-spacing:.13em; text-transform:uppercase; }
.account-panel-header h2 { margin:3px 0 2px; color:#f0f2ed; font-size:20px; font-weight:900; letter-spacing:-.035em; }
.account-panel-header p { margin:0; color:#68717d; font-size:9px; }
.account-panel-header > a,.account-empty a { display:inline-flex; align-items:center; gap:7px; min-height:35px; padding:0 12px; color:#11170b; border-radius:8px; background:var(--account-acid); font-size:8px; font-weight:900; }
.account-table-wrap { overflow-x:auto; }
.account-table { width:100%; min-width:700px; border-collapse:collapse; }
.account-table th { padding:11px 20px; color:#56606d; border-bottom:1px solid var(--account-line); background:rgba(6,9,13,.35); font-size:7px; font-weight:900; letter-spacing:.1em; text-align:left; text-transform:uppercase; }
.account-table td { padding:14px 20px; color:#aab2bc; border-bottom:1px solid rgba(255,255,255,.055); font-size:9px; }
.account-table tbody tr:last-child td { border-bottom:0; }
.account-table tbody > tr:not(.account-order-details):hover td { background:rgba(255,255,255,.018); }
.account-table code { padding:5px 7px; color:#c5ccd5; border:1px solid #28303b; border-radius:6px; background:#0a0e14; font-family:inherit; font-size:8px; }
.account-amount { color:var(--account-green); }
.account-country { padding:5px 7px; border-radius:6px; background:#171d26; font-size:7px; font-weight:900; }
.account-date { display:flex; flex-direction:column; color:#c1c7cf; }
.account-date small { color:#59626f; font-size:7px; }
.account-status { display:inline-flex; align-items:center; gap:7px; padding:6px 9px; color:#969eaa; border:1px solid rgba(255,255,255,.07); border-radius:999px; background:rgba(255,255,255,.025); font-size:7px; font-weight:850; white-space:nowrap; }
.account-status i { width:5px; height:5px; border-radius:50%; background:currentColor; }
.account-status.success { color:var(--account-green); }.account-status.pending,.account-status.warning { color:var(--account-gold); }.account-status.hold { color:var(--account-blue); }.account-status.danger { color:var(--account-red); }
.account-order-number { display:flex; flex-direction:column; color:#edf0e9; font-weight:900; }
.account-order-number small { color:var(--account-acid); font-size:7px; }
.account-expand { display:grid; width:29px; height:29px; place-items:center; color:#77818e; border:1px solid var(--account-line); border-radius:7px; background:#0a0e14; font-size:7px; }
.order-row.expanded .account-expand { color:#101609; border-color:var(--account-acid); background:var(--account-acid); transform:rotate(180deg); }
.account-order-details td { padding:0; background:#090d12; }
.account-order-items { display:grid; gap:5px; padding:14px 22px 18px 60px; box-shadow:inset 3px 0 var(--account-acid); }
.account-order-items > div { display:grid; grid-template-columns:54px 1fr auto; align-items:center; gap:11px; padding:8px 10px; border-radius:9px; background:#10151d; }
.account-item-image { display:grid; width:54px; height:40px; place-items:center; border-radius:7px; background:#0a0e14; }
.account-item-image img { width:90%; height:90%; object-fit:contain; }
.account-order-items > div > span:nth-child(2) { display:flex; flex-direction:column; }
.account-order-items strong { color:#dce0d9; font-size:8px; }.account-order-items small { color:#626b78; font-size:7px; }.account-order-items b { color:var(--account-gold); font-size:9px; }
.account-settings-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(340px,.8fr); gap:55px; padding:40px; }
.account-settings-copy { max-width:500px; }
.account-settings-icon { display:grid; width:52px; height:52px; margin-bottom:20px; place-items:center; border-radius:14px; font-size:21px; }
.account-settings-icon.steam { color:#fff; background:linear-gradient(135deg,#273a4d,#111820); }.account-settings-icon.mail { color:var(--account-gold); background:rgba(255,181,61,.09); }
.account-settings-copy h2 { margin:6px 0 10px; color:#f0f2ed; font-size:28px; font-weight:900; letter-spacing:-.04em; }
.account-settings-copy p { color:#77808c; font-size:10px; line-height:1.7; }
.account-settings-copy ul { display:grid; gap:8px; margin:20px 0 0; padding:0; list-style:none; }
.account-settings-copy li { color:#9ba3ae; font-size:8px; }.account-settings-copy li i { margin-right:8px; color:var(--account-green); }
.account-settings-form { align-self:center; padding:21px; border:1px solid var(--account-line); border-radius:13px; background:#0a0e14; }
.account-settings-form label { display:block; margin-bottom:7px; color:#919aa6; font-size:8px; font-weight:850; text-transform:uppercase; }
.account-input-icon { display:flex; align-items:center; overflow:hidden; border:1px solid #29313d; border-radius:9px; background:#10151d; }
.account-input-icon i { display:grid; width:42px; height:42px; flex:0 0 auto; place-items:center; color:var(--account-acid); border-right:1px solid #29313d; }
.account-input-icon input { width:100%; height:42px; padding:0 12px; color:#e3e6df; border:0; outline:0; background:transparent; font-size:9px; }
.account-settings-form > small { display:block; margin:7px 0 15px; color:#59626f; font-size:7px; line-height:1.5; }
.account-settings-form button { display:flex; width:100%; min-height:40px; align-items:center; justify-content:center; gap:7px; color:#101609; border:0; border-radius:8px; background:var(--account-acid); font-size:9px; font-weight:900; }
.account-help-link { display:block; margin-top:11px; color:#858e9a; font-size:7px; text-align:center; }.account-help-link i { margin-left:4px; }
.account-form-status { min-height:15px; margin:10px 0 0; font-size:8px; text-align:center; }
.account-empty { display:flex; min-height:290px; align-items:center; justify-content:center; flex-direction:column; gap:6px; color:#68717e; }
.account-empty > i { margin-bottom:8px; color:var(--account-acid); font-size:24px; }.account-empty strong { color:#dce0d9; }.account-empty span { font-size:8px; }.account-empty a { margin-top:8px; }

@media (max-width:991px) { .account-summary-grid { grid-template-columns:1fr; }.account-tabs { grid-template-columns:repeat(2,1fr); }.account-settings-layout { grid-template-columns:1fr; gap:30px; }.account-settings-copy { max-width:none; } }
@media (max-width:767px) { .account-hero { padding:125px 0 45px; }.account-hero-inner { align-items:flex-start; flex-direction:column; }.account-balance-card { width:100%; }.account-tabs { grid-template-columns:1fr; }.account-panel-header { align-items:flex-start; flex-direction:column; }.account-summary-grid small { display:none; }.account-settings-layout { padding:24px 18px; } }
@media (max-width:480px) { .account-identity { align-items:flex-start; flex-direction:column; }.account-avatar { width:66px; height:66px; }.account-tabs button small { display:none; } }