:root { --orange:#df813e; --blue:#12a8f2; --paper:#e9e9e9; --ink:#171717; }
* { box-sizing:border-box; }
body { margin:0; min-width:1120px; color:var(--ink); background-color:#252526; background-image:url("assets/web_bg.png"),linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px); background-position:center top; background-size:max(1920px,100vw) auto,60px 60px,60px 60px; background-repeat:no-repeat,repeat,repeat; background-attachment:fixed; font-family:"Microsoft YaHei","Noto Sans SC",sans-serif; }
a { color:inherit; text-decoration:none; } button { font:inherit; }
.profile-shell { min-height:100vh; overflow:hidden; }
.topbar { position:fixed; z-index:100; top:0; left:0; width:100%; height:92px; display:grid; grid-template-columns:360px 1fr 268px; align-items:stretch; color:#f7f7f7; background:rgba(20,15,16,.98); border-bottom:2px solid rgba(255,255,255,.07); }
.brand { display:grid; place-items:center start; padding-left:20px; }.brand img { width:175px; height:65px; object-fit:contain; }
.topbar > nav { display:flex; justify-content:space-around; align-items:stretch; } .topbar > nav > a { min-width:180px; display:grid; place-items:center; position:relative; font-size:29px; font-weight:bold; letter-spacing:5px; transition:color .15s; } .topbar > nav > a:hover { color:#ff8a13; }
.download { background:url("assets/web_download_btn.png") center / 268px 91px no-repeat; }
.account-bar { position:relative; z-index:90; height:73px; margin-top:92px; padding:0 max(78px,calc((100vw - 1740px)/2)); display:flex; align-items:center; justify-content:flex-end; gap:12px; color:#f4f4f4; font-size:22px; background:rgba(0,0,0,.3); }
.account-bar b { padding:2px 9px; color:#0d3110; border-radius:15px; background:#8df442; font-size:17px; }.account-bar i { height:37px; margin:0 8px; border-left:1px solid #eee; }.account-bar .qldy-auth-logout { margin-left:70px; color:#1fbaff; }
.page-title { position:absolute; z-index:91; top:92px; left:max(92px,calc((100vw - 1738px)/2 + 12px)); height:73px; display:flex; align-items:center; pointer-events:none; }.title-arrow { width:56px; height:22px; margin-right:16px; background:url("assets/web_title_arrow.png") center / contain no-repeat; }.page-title h1 { margin:0; color:#eee; font-size:30px; }
.profile-main { width:min(1738px,calc(100vw - 182px)); margin:0 auto; padding-bottom:60px; }
.identity-card { min-height:308px; padding:30px 28px 25px 78px; display:grid; grid-template-columns:180px minmax(600px,1fr) 220px; gap:50px; align-items:start; background:rgba(239,239,239,.96); }
.profile-avatar { width:180px; height:180px; object-fit:cover; border:4px solid #2c2525; background:#fff; }
.profile-fields { margin:0; display:grid; gap:12px; font-size:20px; }.profile-fields>div { display:grid; grid-template-columns:155px 1fr; gap:0; min-height:33px; align-items:center; }.profile-fields>div[hidden] { display:none; }.profile-fields dt { font-weight:bold; }.profile-fields dd { margin:0; overflow-wrap:anywhere; }.profile-fields a { color:#167cbd; }.profile-fields a:hover { text-decoration:underline; }
.owner-actions { align-self:end; display:grid; gap:13px; }.owner-actions[hidden] { display:none; }.owner-actions a { height:60px; display:grid; place-items:center; border:1px solid currentColor; background:rgba(255,255,255,.18); font-size:20px; font-weight:bold; transition:color .15s,background .15s,box-shadow .15s; }.backpack-button { color:var(--blue); }.edit-button { color:var(--orange); }.owner-actions .backpack-button:hover { color:#fff; background:var(--blue); box-shadow:0 0 18px rgba(18,168,242,.35); }.owner-actions .edit-button:hover { color:#fff; background:var(--orange); box-shadow:0 0 18px rgba(223,129,62,.35); }
.staff-message-action { align-self:end; position:relative; }.staff-message-action>summary { height:60px; display:grid; place-items:center; color:#fff; border:1px solid #df813e; background:#df813e; font-size:19px; font-weight:bold; cursor:pointer; list-style:none; }.staff-message-action>summary::-webkit-details-marker { display:none; }.staff-message-form { position:absolute; z-index:20; top:70px; right:0; width:380px; padding:18px; display:grid; gap:12px; border:1px solid #d7d7d7; background:#fff; box-shadow:0 16px 40px rgba(0,0,0,.22); }.staff-message-form textarea { width:100%; min-height:120px; padding:12px; resize:vertical; border:1px solid #ccc; font-size:17px; line-height:1.55; }.staff-message-form button { height:46px; color:#fff; border:0; background:#df813e; font-size:18px; font-weight:bold; cursor:pointer; }.staff-message-form button:hover { filter:brightness(1.06); }.profile-message-result { width:min(1738px,calc(100vw - 182px)); margin:12px auto 0; padding:14px 20px; font-size:17px; }.profile-message-result.is-success { color:#1b6428; border-left:4px solid #37a653; background:#eaf8ed; }.profile-message-result.is-error { color:#8f2525; border-left:4px solid #d44c4c; background:#fff0f0; }
.profile-not-found { grid-column:1/-1; min-height:240px; display:grid; place-items:center; align-content:center; gap:14px; text-align:center; }.profile-not-found h2,.profile-not-found p { margin:0; }.profile-not-found a { color:#1687c5; border-bottom:1px solid currentColor; }
.profile-main.is-not-found .history-panel { display:none; }
.history-panel { margin-top:12px; min-height:600px; background:rgba(239,239,239,.97); }
.history-tabs { height:90px; display:flex; justify-content:center; gap:36px; color:#eee; background:#1c1c1c; }.history-tab { position:relative; width:235px; padding:0; color:#eee; border:0; background:transparent; font-size:24px; cursor:pointer; }.history-tab.is-active { color:#f2c993; font-weight:bold; }.history-tab.is-active::after { content:""; position:absolute; left:50%; bottom:0; width:234px; height:18px; background:url("assets/web_community_btn.png") center bottom / 234px 18px no-repeat; transform:translateX(-50%); }
.history-list { width:min(1208px,calc(100% - 300px)); min-height:510px; margin:0 auto; padding:25px 16px 45px; background:#fff; }
.history-empty { min-height:440px; display:grid; place-items:center; color:#888; font-size:22px; }
.history-item { display:block; padding:18px 24px 20px; border-bottom:1px solid #d4d4d4; transition:background .15s; }.history-item:hover { background:#f6f6f6; }.history-item h2 { margin:0 0 14px; overflow:hidden; font-size:20px; white-space:nowrap; text-overflow:ellipsis; }.history-meta { display:flex; gap:60px; font-size:17px; }.reply-quote { margin:10px 0 14px; padding-left:12px; border-left:4px solid #62baf3; font-size:17px; line-height:1.6; }.reply-quote img.bbs-emote { display:inline-block; width:32px; height:32px; margin:0 3px; object-fit:contain; vertical-align:middle; }.reply-parent { margin:10px 0 0; padding-left:12px; border-left:4px solid #ff9b32; color:#555; }
.message-indicator { position:relative; width:28px; height:32px; display:block; }.message-indicator img { width:28px; height:32px; }.message-indicator.has-unread::after { content:""; position:absolute; top:-3px; right:-4px; width:11px; height:11px; border:2px solid #1b1c1d; border-radius:50%; background:#ff2630; }
@media (max-width:1350px) { .topbar { grid-template-columns:270px 1fr 210px; } .topbar > nav > a { min-width:110px; }.profile-main { width:calc(100vw - 120px); }.identity-card { padding-left:45px; grid-template-columns:170px 1fr 190px; gap:30px; }.profile-avatar { width:170px; height:170px; }.history-list { width:calc(100% - 180px); }.account-bar { padding-left:60px; padding-right:60px; } }