:root { --gold:#ffc400; --ink:#090909; --cream:#fff7da; --card:#171715; --line:#3c3932; --muted:#aaa493; }
* { box-sizing:border-box; }
[hidden] { display:none !important; }
body { margin:0; min-width:320px; color:var(--cream); background:radial-gradient(circle at 80% 0,rgba(255,196,0,.13),transparent 32%),#090909; font-family:Arial,Helvetica,sans-serif; }
button,input,select { font:inherit; }
.account-topbar { min-height:78px; width:min(1240px,calc(100% - 36px)); margin:auto; display:flex; align-items:center; justify-content:space-between; gap:24px; border-bottom:1px solid #2c2a25; }
.account-brand { display:grid; grid-template-columns:46px auto; color:var(--cream); text-decoration:none; }
.account-brand > span { grid-row:1/3; width:38px; height:38px; display:grid; place-items:center; color:var(--ink); border-radius:10px; background:var(--gold); font-size:25px; }
.account-brand b { font-size:15px; letter-spacing:.08em; }.account-brand small { color:var(--gold); font-size:9px; font-weight:900; letter-spacing:.12em; }
.account-topbar nav { display:flex; gap:18px; }.account-topbar nav a { color:var(--muted); text-decoration:none; font-size:11px; font-weight:900; }.account-topbar nav a:hover { color:var(--gold); }
main { width:min(1240px,calc(100% - 36px)); margin:0 auto; padding:34px 0 90px; }
.auth-shell { min-height:calc(100vh - 150px); display:grid; grid-template-columns:1fr minmax(360px,540px); align-items:center; gap:70px; }
.auth-intro > span,.dashboard-hero span,.dashboard-section header span { color:var(--gold); font-size:11px; font-weight:950; letter-spacing:.15em; }
.auth-intro h1 { max-width:700px; margin:12px 0; font-size:clamp(52px,8vw,108px); line-height:.82; letter-spacing:-.055em; }
.auth-intro p { max-width:520px; color:var(--muted); font-size:18px; line-height:1.55; }
.auth-card { padding:22px; border:1px solid #4b463b; border-radius:20px; background:rgba(19,19,17,.94); box-shadow:0 28px 80px rgba(0,0,0,.45); }
.auth-tabs { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:20px; }.auth-tabs button { min-height:46px; border:1px solid var(--line); border-radius:9px; color:var(--muted); background:#0f0f0e; font-weight:950; cursor:pointer; }.auth-tabs button.is-active { color:var(--ink); border-color:var(--gold); background:var(--gold); }
.auth-form { display:grid; gap:14px; }.auth-form h2,.recovery-panel h2 { margin:0 0 4px; font-size:28px; }.auth-form label,.address-form label { display:grid; gap:7px; }.auth-form label span,.address-form label span { color:#c7c0ae; font-size:11px; font-weight:900; }
.auth-form input,.address-form input,.address-form select { width:100%; min-height:48px; padding:0 13px; border:1px solid #4b473e; border-radius:9px; color:var(--cream); background:#20201d; }.auth-form input:focus,.address-form input:focus,.address-form select:focus { outline:3px solid rgba(255,196,0,.3); border-color:var(--gold); }
.two-columns { display:grid; grid-template-columns:1fr 1fr; gap:12px; }.auth-form > small { color:var(--muted); line-height:1.4; }
.primary-button,.secondary-button { min-height:48px; padding:0 18px; border-radius:9px; font-size:11px; font-weight:950; cursor:pointer; }.primary-button { border:0; color:var(--ink); background:var(--gold); }.secondary-button { border:1px solid #4d493f; color:var(--cream); background:transparent; }.text-button,.back-button { border:0; color:var(--gold); background:transparent; font-size:12px; font-weight:900; cursor:pointer; }
.recovery-panel > p { color:var(--muted); line-height:1.5; }.back-button { padding:0 0 16px; }.reset-form { margin-top:20px; padding-top:20px; border-top:1px solid var(--line); }
.form-message { margin-top:14px; padding:12px; border:1px solid #8b382e; border-radius:9px; color:#ffd7d2; background:#321713; font-size:13px; line-height:1.45; }.form-message.is-success { color:#d8ffe0; border-color:#397a47; background:#132918; }
.page-loading { min-height:55vh; display:grid; place-items:center; color:var(--gold); font-weight:900; }
.dashboard-hero { min-height:260px; padding:34px; display:flex; align-items:flex-end; justify-content:space-between; gap:24px; border:1px solid #4a453a; border-radius:22px; background:linear-gradient(125deg,#181816,#0c0c0b 62%); }
.dashboard-hero h1 { margin:8px 0 4px; font-size:clamp(46px,7vw,88px); line-height:.9; }.dashboard-hero p { margin:0; color:var(--muted); font-size:18px; }.hero-actions { display:flex; gap:10px; }.hero-actions a,.hero-actions button { min-height:46px; padding:0 18px; display:inline-flex; align-items:center; border:1px solid var(--gold); border-radius:9px; color:var(--ink); background:var(--gold); text-decoration:none; font-size:11px; font-weight:950; cursor:pointer; }.hero-actions button { color:var(--gold); background:transparent; }
.account-stats { margin:16px 0 34px; display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }.account-stats article { min-height:126px; padding:20px; border:1px solid var(--line); border-radius:15px; background:var(--card); }.account-stats span,.account-stats small { display:block; color:var(--muted); font-size:10px; font-weight:900; }.account-stats strong { display:block; margin:14px 0 4px; color:var(--gold); font-size:30px; }
.dashboard-section { margin-top:24px; padding:22px; border:1px solid var(--line); border-radius:18px; background:#11110f; }.dashboard-section > header { margin-bottom:16px; display:flex; align-items:end; justify-content:space-between; gap:18px; }.dashboard-section h2 { margin:5px 0 0; font-size:28px; }.dashboard-section > header button { min-height:42px; padding:0 14px; border:1px solid var(--gold); border-radius:8px; color:var(--ink); background:var(--gold); font-size:10px; font-weight:950; cursor:pointer; }
.address-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }.address-card,.history-card,.wallet-row,.empty-state { padding:16px; border:1px solid #39362f; border-radius:12px; background:#1a1a18; }.address-card header,.history-card header,.wallet-row { display:flex; justify-content:space-between; gap:16px; }.address-card h3,.history-card h3 { margin:0; }.address-card p,.history-card p { color:var(--muted); line-height:1.5; }.address-actions { display:flex; gap:8px; }.address-actions button { border:0; color:var(--gold); background:transparent; font-size:10px; font-weight:950; cursor:pointer; }.address-actions .delete-address { color:#ff8175; }
.orders-refresh-note { color:var(--muted); font-size:12px; }.order-group + .order-group { margin-top:22px; padding-top:20px; border-top:1px solid #34312b; }.order-group > h3 { margin:0 0 10px; color:var(--gold); font-size:13px; letter-spacing:.06em; text-transform:uppercase; }.order-history,.wallet-history { display:grid; gap:10px; }.history-card { position:relative; }.history-card header span { color:var(--gold); font-size:13px; font-weight:950; }.history-card strong { color:var(--gold); }.history-card p { margin-bottom:8px; }.history-status { display:inline-flex; margin:8px 0 2px; padding:6px 9px; border:1px solid #5a5140; border-radius:999px; color:var(--gold); background:#272216; font-size:10px; font-weight:950; }.history-status[data-status="delivered"] { color:#9be8a9; border-color:#326b3e; background:#142619; }.history-status[data-status="cancelled"] { color:#ff9d93; border-color:#7d392f; background:#2e1713; }.history-address { color:#d7cfba !important; font-size:12px; }.history-meta { color:#c9c2ae; font-size:12px; }.wallet-row { align-items:center; }.wallet-row small { display:block; margin-top:5px; color:var(--muted); }.wallet-row b { color:#75db8a; font-size:20px; }.wallet-row b.is-negative { color:#ff8175; }.empty-state { color:var(--muted); text-align:center; }
.address-dialog { width:min(700px,calc(100% - 24px)); max-height:calc(100vh - 24px); padding:0; border:1px solid var(--gold); border-radius:18px; color:var(--cream); background:#121210; }.address-dialog::backdrop { background:rgba(0,0,0,.76); backdrop-filter:blur(4px); }.address-form { padding:20px; display:grid; gap:14px; }.address-form header { display:flex; justify-content:space-between; align-items:center; }.address-form h2 { margin:4px 0 0; }.address-form header > div > span { color:var(--gold); font-size:10px; font-weight:950; }.address-form header > button { width:40px; height:40px; border:1px solid var(--line); border-radius:50%; color:var(--cream); background:#222; font-size:24px; cursor:pointer; }.dialog-actions { display:grid; grid-template-columns:1fr auto; gap:10px; }
@media (max-width:800px) { .auth-shell { grid-template-columns:1fr; gap:24px; }.auth-intro { padding-top:20px; }.auth-intro h1 { font-size:58px; }.account-topbar nav a:not(:first-child) { display:none; }.dashboard-hero { min-height:300px; align-items:flex-start; flex-direction:column; justify-content:flex-end; }.account-stats { grid-template-columns:1fr; }.address-grid { grid-template-columns:1fr; } }
@media (max-width:520px) { .account-topbar,main { width:calc(100% - 24px); }.account-topbar nav { display:none; }.auth-card { padding:14px; }.two-columns { grid-template-columns:1fr; }.dashboard-hero { padding:22px; }.dashboard-hero h1 { font-size:45px; }.hero-actions { width:100%; }.hero-actions a,.hero-actions button { flex:1; justify-content:center; }.dashboard-section { padding:14px; }.dashboard-section > header { align-items:stretch; flex-direction:column; }.dialog-actions { grid-template-columns:1fr; } }
