/* 角色查询、基纳行情（characters.html / market.html），结构由 pc.mjs 渲染，类名保持不变 */
button,input,select{font:inherit}
input,select{min-height:46px;border:1px solid var(--line);border-radius:10px;background:var(--bg2);color:var(--ink);padding:0 14px}
input:focus-visible,select:focus-visible{outline:none;border-color:var(--gold);box-shadow:0 0 0 1px var(--gold)}
select{max-width:100%;cursor:pointer}
.muted{color:var(--muted);font-size:13px}
.tag:empty{display:none}
.empty{text-align:center;padding:60px 20px;color:var(--muted)}
.error{color:#f29c8c!important}
#notice{color:var(--gold);margin:14px 0}
#notice:empty{display:none}
.panel{padding:22px;min-width:0}
.pg-h{padding:44px 0 26px}
.pg-h h1,.market-heading h1{font-size:40px;margin:12px 0 6px}
#market-types[hidden],#market-alert-link[hidden],#article-language[hidden],#article-refresh[hidden],#article-source[hidden],#news-load[hidden]{display:none}
.segmented{display:flex;padding:3px;border-radius:10px;background:var(--bg2);border:1px solid var(--line);gap:2px}
.segmented button{flex:1;padding:0 14px;min-height:38px;border-radius:8px;font-size:14px;color:var(--muted);white-space:nowrap}
.segmented button:hover{color:var(--ink)}
.segmented button[aria-pressed=true]{background:var(--raise);color:var(--gold)}
.up{color:var(--up)!important}.down{color:var(--down)!important}

/* 角色查询 */
.searchbar{display:grid;grid-template-columns:150px auto 200px minmax(0,1fr) auto;gap:10px;padding:12px;border-radius:16px;border:1px solid var(--line2);background:var(--surface);box-shadow:var(--shadow)}
.searchbar .btn{min-width:120px}
.search-input{display:flex;align-items:center;gap:8px;padding-left:14px;border:1px solid var(--line);border-radius:10px;background:var(--bg2);color:var(--muted);min-width:0}
.search-input:focus-within{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold)}
.search-input input{flex:1;width:0;border:0;background:transparent;padding:0 4px}
.search-input input:focus-visible{box-shadow:none}
.search-input button{align-self:stretch;padding:0 14px;border-left:1px solid var(--line);font-size:13px;color:var(--ink2);white-space:nowrap}
.search-input button:hover{color:var(--gold)}
#search-results{margin-bottom:20px}
.result-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.result,.recent-item{display:flex;gap:12px;align-items:center;text-align:left;min-width:0}
.result{padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:var(--bg2)}
.result:hover{border-color:var(--gold-deep)}
.result small{display:block;color:var(--muted);font-size:12px}
.result img,.recent-item img{width:42px;height:42px;object-fit:cover;border-radius:50%;flex:none;border:1px solid var(--line2)}
.character-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;margin-top:28px;align-items:start}
.character-panel{overflow:hidden;min-width:0}
.character-panel .empty .ornament{display:inline-grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--gold-soft);color:var(--gold)}
.character-panel .empty .ornament svg{width:28px;height:28px}
.character-panel .empty h2{font:600 24px var(--serif);color:var(--ink);margin:18px 0 8px}
#profile:not(.empty){display:grid;grid-template-columns:minmax(0,1fr);gap:22px;align-items:center;padding:28px;background:radial-gradient(70% 140% at 0% 0%,rgba(224,189,130,.14),transparent 60%),linear-gradient(180deg,#1b2120,var(--surface));border-bottom:1px solid var(--line)}
.profile-head{display:flex;gap:18px;align-items:center;min-width:0}
.avatar{width:88px;height:88px;border-radius:50%;object-fit:cover;border:2px solid var(--gold);box-shadow:0 0 0 5px rgba(224,189,130,.12);flex:none}
.identity h2{font:650 26px var(--sans);margin-bottom:4px;overflow-wrap:anywhere}
.identity p{font-size:14px;color:var(--ink2)}.identity .muted{font-size:13px}
.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.metric{padding:0 12px;border-left:1px solid var(--line);min-width:0}
.metric small{font-size:12px;color:var(--muted)}
.metric strong{display:block;font:600 24px/1.5 var(--mono);color:var(--gold2);white-space:nowrap}
#character-body{padding:0 22px 22px}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin:0 -22px 18px;padding:0 20px}
.tabs button{padding:14px 14px;font-size:15px;color:var(--muted);border-bottom:2px solid transparent;margin-bottom:-1px}
.tabs button:hover{color:var(--ink)}
.tabs button[aria-pressed=true]{color:var(--gold);border-color:var(--gold)}
.equipment-filters{margin-bottom:14px;max-width:520px}
.equipment-filters button{font-size:13px;min-height:34px}
.equipment-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.equipment{display:flex;align-items:center;gap:12px;text-align:left;padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:var(--bg2);min-width:0;transition:border-color .15s}
button.equipment:not(:disabled):hover{border-color:var(--gold-deep)}
.equipment:disabled{opacity:1;cursor:default}
.equipment img{width:46px;height:52px;object-fit:contain;flex:none;border-radius:8px}
.equipment span{min-width:0}
.equipment b{display:block;font-size:13.5px;font-weight:600;overflow-wrap:anywhere}
.equipment small{display:block;color:var(--muted);font-size:11.5px}
.equipment-grade-epic{color:#eda86b}.equipment-grade-unique{color:#e2b969}.equipment-grade-legend{color:#72b9eb}.equipment-grade-rare{color:#75bf8b}.equipment-grade-mythic{color:#f18787}.equipment-grade-special{color:#73cfb6}
.equipment[class*=grade-epic]{border-color:#eda86b40}.equipment[class*=grade-unique]{border-color:#e2b96940}.equipment[class*=grade-legend]{border-color:#72b9eb40}.equipment[class*=grade-mythic]{border-color:#f1878740}
.attributes{display:grid;grid-template-columns:1fr 1fr;gap:0 28px}
.attribute{padding:12px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:10px;font-size:14px}
.attribute strong{font-family:var(--mono);color:var(--gold2)}
.growth-entry{border-bottom:1px solid var(--line);padding:14px 0}
.growth-entry h3{font:600 14px var(--mono);color:var(--gold)}
.growth-entry li{color:var(--ink2);font-size:14px;margin-top:4px}
#character-status{border-top:1px solid var(--line);padding-top:14px;margin-top:20px}
.side-stack{display:grid;gap:16px;align-content:start}
.side-stack h2{display:flex;justify-content:space-between;align-items:center;gap:8px;font:650 16px var(--sans);margin-bottom:10px}
.side-stack h2 .link{min-height:0;font-size:13px}
.news-item,.recent-item{display:flex;padding:11px 0;border-top:1px solid var(--line);width:100%;font-size:14px;color:var(--ink)}
.news-item{display:block}.news-item:hover,.recent-item:hover{color:var(--gold)}
.news-item small{display:block;color:var(--muted);margin-top:2px;font-size:12px}
.news-toolbar{display:flex;align-items:center;gap:8px;margin-bottom:16px}
/* 资讯页 */
.news-filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:12px}
#news-load,#article-source{margin-top:16px}
#article-title{font-family:var(--sans);font-size:24px;line-height:1.4;margin:12px 0 8px}
.article-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-bottom:16px;border-bottom:1px solid var(--line)}
.article-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.article-body{max-width:760px;padding-top:16px;font-size:15px;line-height:1.8;color:var(--ink2);overflow-wrap:anywhere}
.article-body img{max-width:100%;height:auto;margin:12px 0;border-radius:8px}
.article-body a{color:var(--gold)}
.article-body table{display:block;overflow-x:auto;border-collapse:collapse;margin:12px 0}.article-body th,.article-body td{padding:8px 10px;border:1px solid var(--line)}
.news-toolbar h2{margin:0}.news-toolbar .link{margin-left:auto}
#news-source{min-height:36px;padding:0 8px;font-size:14px}
.utility{display:block;transition:border-color .2s}
.utility:hover{border-color:var(--gold-deep)}
.utility h2{margin-bottom:4px}
.promo{background:linear-gradient(135deg,rgba(224,189,130,.1),transparent),var(--surface)}
.promo .link{min-height:0;margin-top:10px;font-size:14px}

/* 基纳行情 */
.market-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:44px 0 22px}
.market-heading #market-title{color:var(--muted)}
.picker{display:flex;gap:10px;align-items:center}
.picker .btn{min-height:46px}
.srv-pick{position:relative}
.srv-pick summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;min-height:46px;padding:0 16px;border-radius:10px;border:1px solid var(--line2);background:var(--surface);font-weight:650;width:320px}
.srv-pick summary::-webkit-details-marker{display:none}
.srv-pick summary span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.srv-pick summary:after{content:"▾";color:var(--muted);margin-left:auto}
.srv-pick[open] summary{border-color:var(--gold-deep)}
/* 弹层与按钮同宽对齐，不压住左侧的币种切换。 */
.srv-panel{position:absolute;left:0;right:0;top:calc(100% + 8px);z-index:20;padding:14px;border-radius:14px;border:1px solid var(--line2);background:var(--surface);box-shadow:var(--shadow);display:grid;gap:10px}
.srv-panel input{width:100%;font-size:14px}
#server-list{max-height:360px;overflow:auto;display:grid;gap:2px}
#server-list button{display:block;width:100%;text-align:left;padding:10px 12px;border-radius:8px;font-size:14px;color:var(--ink2)}
#server-list button:hover{background:var(--raise);color:var(--ink)}
#server-list button[aria-pressed=true]{background:var(--gold-soft);color:var(--gold)}
.quotes{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:14px}
.quote{padding:20px 22px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);min-width:0}
.quote:first-child{border-color:#5d4e33;background:radial-gradient(90% 120% at 0% 0%,rgba(224,189,130,.12),transparent 60%),var(--surface)}
.quote p{font-size:12.5px;color:var(--muted)}
.quote strong{display:block;font:600 28px var(--mono);margin:4px 0;overflow-wrap:anywhere}
.quote:first-child strong{font-size:36px;color:var(--gold2)}
.quote small{font-size:12px;color:var(--muted)}
.chart-panel{margin-top:14px}
.section-title{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:12px}
.section-title h2{font:650 18px var(--sans)}
.chart-panel .segmented button{font-size:13px;min-height:32px}
.chart{width:100%;min-height:290px}
.chart svg{width:100%;height:auto;display:block}
.chart svg text{font-family:var(--mono)}
.chart-inspector{display:flex;align-items:center;justify-content:space-between;gap:14px 24px;flex-wrap:wrap;padding:12px 16px;border:1px solid var(--line);border-radius:10px;background:var(--bg2);font-family:var(--mono);font-variant-numeric:tabular-nums}
.chart-inspector-time{display:flex;align-items:baseline;gap:12px;white-space:nowrap}
.chart-inspector-time strong{font-size:15px;color:var(--gold2)}
.chart-inspector-time small{font-size:12px;color:var(--muted)}
.chart-inspector-values{display:flex;gap:10px 18px;flex-wrap:wrap;color:var(--muted)}
.chart-inspector-values span{display:grid;gap:2px;white-space:nowrap}
.chart-inspector-values small{font:12px var(--sans)}
.chart-inspector-values strong{color:var(--ink);font-size:16px}
.chart-legend{display:flex;align-items:center;gap:10px 18px;flex-wrap:wrap;padding:9px 4px 2px;color:var(--muted);font-size:12px}
.chart-legend span{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.chart-legend span:before{content:"";display:block;width:14px;height:3px;border-radius:2px;background:currentColor}
.chart-legend .chart-legend-up{color:var(--up)}
.chart-legend .chart-legend-down{color:var(--down)}
.chart-legend .chart-legend-ma5{color:var(--gold2)}
.chart-legend .chart-legend-ma20{color:#c99be6}
.chart-legend .chart-legend-ma10{color:var(--data)}
.chart-legend .chart-legend-samples:before{height:9px;width:7px;background:var(--muted);opacity:.5}
.chart-legend .chart-legend-hint{margin-left:auto}
.chart-legend .chart-legend-hint:before{display:none}
.chart-graph{position:relative}
.chart-tooltip{position:absolute;z-index:3;width:208px;max-width:calc(100% - 16px);padding:12px 14px;border:1px solid var(--gold-deep);border-radius:10px;background:rgba(24,29,28,.97);box-shadow:0 12px 32px rgba(0,0,0,.4);pointer-events:none;font:12px var(--mono);font-variant-numeric:tabular-nums}
.chart-tooltip[hidden]{display:none}
.chart-tooltip>strong{display:block;color:var(--gold2);font-size:14px}
.chart-tooltip>small{display:block;margin-top:2px;color:var(--muted);font:11px var(--sans)}
.chart-tooltip dl{display:grid;gap:5px;margin:10px 0 0;padding-top:9px;border-top:1px solid var(--line)}
.chart-tooltip dl div{display:flex;justify-content:space-between;gap:12px;white-space:nowrap}
.chart-tooltip dt{color:var(--muted)}
.chart-tooltip dd{margin:0;color:var(--ink);font-weight:600}
.chart-tooltip dd.up{color:var(--up)}
.chart-tooltip dd.down{color:var(--down)}
.chart svg[tabindex]{cursor:crosshair;touch-action:pan-y}
.chart-plot{fill:var(--bg2);stroke:var(--line)}
.chart-grid{fill:none;stroke:var(--line2);opacity:.75}
.chart-grid-vertical{stroke-dasharray:3 7;opacity:.45}
.chart-axis{fill:var(--muted);font-size:12px}
.chart-volume-base{fill:none;stroke:var(--line2)}
.candle-up .candle-wick{stroke:var(--up)}
.candle-up .candle-body,.candle-up .sample-bar{fill:var(--up)}
.candle-down .candle-wick{stroke:var(--down)}
.candle-down .candle-body,.candle-down .sample-bar{fill:var(--down)}
.candle-flat .candle-wick{stroke:var(--gold)}
.candle-flat .candle-body,.candle-flat .sample-bar{fill:var(--gold)}
.chart .sample-bar{opacity:.42}
.chart-average{fill:none;stroke-width:2;stroke-linejoin:round;stroke-linecap:round;pointer-events:none}
.chart-average-5{stroke:var(--gold2)}
.chart-average-10{stroke:var(--data)}
.chart svg[tabindex] .last-line{fill:none;stroke:var(--gold);stroke-dasharray:4 6;opacity:.7}
.chart svg[tabindex] .last-pulse{fill:var(--gold)}
.chart .last-dot{fill:var(--gold2)}
.chart-price-tag{fill:var(--gold2)}
.chart-price-text{fill:var(--gold-ink);font-size:12px;font-weight:700}
.chart-crosshair{pointer-events:none}
.chart-crosshair[hidden]{display:none}
.chart-crosshair path{fill:none;stroke:var(--data);stroke-dasharray:3 5;opacity:.8}
.chart-crosshair circle{fill:var(--surface);stroke:var(--data);stroke-width:2}
.chart-details{border-top:1px solid var(--line);margin-top:4px}
.chart-details summary{display:flex;align-items:center;gap:8px;min-height:42px;list-style:none;cursor:pointer;color:var(--gold);font-size:13px}
.chart-details summary::-webkit-details-marker{display:none}
.chart-details summary:before{content:"▸";transition:transform .2s}
.chart-details[open] summary:before{transform:rotate(90deg)}
.chart-details summary span{margin-left:auto;color:var(--muted)}
.chart-detail-scroll{max-height:360px;overflow:auto;border:1px solid var(--line);border-radius:8px}
.chart-details table{min-width:850px;font:13px var(--mono);font-variant-numeric:tabular-nums}
.chart-details th,.chart-details td{padding:9px 12px;text-align:right;white-space:nowrap}
.chart-details th:first-child,.chart-details td:first-child{text-align:left}
.chart-details thead th{position:sticky;top:0;z-index:1;background:var(--bg2)}
#chart-note{text-align:right;font-size:12px;margin-top:6px}
.listings{margin-top:14px;overflow:hidden}
.listings .section-title{padding:18px 22px 0}
.table-scroll{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:14px}
th{font-weight:500;font-size:12px;color:var(--muted);text-align:left;padding:12px 22px;background:var(--bg2);white-space:nowrap}
td{padding:14px 22px;border-top:1px solid var(--line)}
td:nth-child(3){min-width:150px}
td:last-child{white-space:nowrap;font-family:var(--mono);color:var(--muted);font-size:13px}
tbody tr:hover td{background:rgba(255,255,255,.015)}

.listing-price{color:#f2cc87;font:600 14px var(--mono);white-space:nowrap}
.source-badge{display:inline-block;padding:2px 9px;border-radius:6px;font-size:12px;font-weight:600;white-space:nowrap;border:1px solid var(--line2)}
.source-badge[data-source="DD373"]{color:#dcb9fa;background:#a76fd922;border-color:#a76fd966}
.source-badge[data-source="7881"]{color:#99cfff;background:#549dde22;border-color:#549dde66}
.pagination{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 22px;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}
.pagination .btn{min-height:36px;font-size:13px}
.pagination .btn:disabled{opacity:.4;cursor:default;transform:none}
.foot-note{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;margin-top:12px;font-size:13px;color:var(--muted)}
.foot-note .link{font-size:13px}

/* 装备详情弹窗（equipment-detail.mjs） */
dialog{background:var(--surface);border:1px solid var(--gold-deep);color:var(--ink);border-radius:16px;max-width:620px;width:calc(100% - 32px);max-height:85vh;padding:24px;overflow-y:auto;box-shadow:var(--shadow)}
dialog::backdrop{background:rgba(0,0,0,.72)}
dialog form{position:sticky;top:-24px;background:var(--surface);z-index:1;text-align:right;padding-top:2px}
dialog form button{padding:6px 12px;border-radius:8px;border:1px solid var(--line2);font-size:13px}
dialog h2{margin:10px 0;font:650 20px var(--sans)}
dialog img{width:80px;height:80px;object-fit:contain}
.item-summary{display:flex;align-items:center;gap:16px}.item-summary h2{overflow-wrap:anywhere}
.item-section{border-top:1px solid var(--line);margin-top:20px;padding-top:12px}.item-section h3{color:var(--gold);font-size:16px;margin:0 0 12px}
.item-row{display:flex;justify-content:space-between;gap:20px;padding:6px 0;font-size:14px}.item-row>span{color:var(--muted)}.item-row strong{text-align:right;font-weight:500;overflow-wrap:anywhere}
.item-description{white-space:pre-wrap;overflow-wrap:anywhere;margin:6px 0}
.item-stone{display:flex;align-items:flex-start;gap:12px;margin:12px 0}.item-stone img{width:36px;height:36px;flex:none}
.item-set-bonus{padding:8px 0;color:var(--muted)}.item-set-bonus.active{color:var(--gold)}

@media(min-width:1400px){.equipment-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1100px){.character-layout{grid-template-columns:minmax(0,1fr)}#profile:not(.empty){grid-template-columns:minmax(0,1fr)}.equipment-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.quotes{grid-template-columns:1fr 1fr}.result-grid{grid-template-columns:1fr 1fr}.searchbar{grid-template-columns:auto minmax(0,1fr)}.searchbar #server,.searchbar .search-input{grid-column:1/-1}.searchbar .btn{grid-column:1/-1}}
@media(max-width:760px){
  .pg-h,.market-heading{padding:28px 0 18px}.pg-h h1,.market-heading h1{font-size:32px}
  .searchbar{grid-template-columns:repeat(2,minmax(0,1fr))}
  #profile:not(.empty){padding:20px}.avatar{width:68px;height:68px}.identity h2{font-size:23px}
  .metrics{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:14px}.metric:nth-child(odd){border-left:0;padding-left:0}.metric strong{font-size:18px}
  #character-body{padding:0 14px 16px}.tabs{margin:0 -14px 14px;padding:0 8px;overflow-x:auto}.tabs button{padding:12px 10px;font-size:14px;white-space:nowrap}
  .equipment-grid{grid-template-columns:minmax(0,1fr)}.attributes{grid-template-columns:minmax(0,1fr)}.result-grid{grid-template-columns:minmax(0,1fr)}
  .picker{width:100%;flex-wrap:wrap;position:relative}#market-types{width:100%}.srv-pick{flex:1;min-width:0;position:static}.srv-pick summary{width:auto}
  .quotes{gap:10px}.quote{padding:14px}.quote strong{font-size:22px}.quote:first-child{grid-column:1/-1}.quote:first-child strong{font-size:28px}
  .chart{min-height:180px}.chart-panel .segmented{width:100%}
  th,td{padding:12px 14px}.listings .section-title{padding:14px 14px 0}.pagination{padding:12px 14px}
}

/* 技能详情（特化、连续技、特化参考） */
.skill-spec{color:var(--gold)!important}
.skill-source{font-size:13px;color:var(--data)}
.skill-chosen{display:flex;gap:8px;flex-wrap:wrap;margin:4px 0 6px}
.skill-chosen img{width:40px;height:40px;border-radius:8px;border:1px solid var(--gold)}
.skill-step{padding:10px 0;border-top:1px solid var(--line)}
.skill-step:first-of-type{border-top:0}
.skill-step-head{display:flex;justify-content:space-between;align-items:center;gap:12px}
.skill-step-head .link{min-height:32px;font-size:13px}
.skill-ref{margin-top:8px;padding:10px 12px;border-radius:10px;background:var(--bg2);border:1px solid var(--line)}
.skill-source-line{margin-top:16px;font-size:12px}
.skill-spec-row{display:flex;gap:12px;align-items:flex-start;padding:10px 12px;margin-top:8px;border-radius:10px;border:1px solid var(--line);background:var(--bg2)}
.skill-spec-row.selected{border-color:var(--gold-deep);background:var(--gold-soft)}
.skill-spec-row img{width:36px;height:36px;border-radius:8px;flex:none}
.skill-spec-head{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--ink2)}
.skill-spec-row .item-description{margin:4px 0 0;font-size:13.5px;color:var(--ink2)}

/* 行情：K 线从左到右绘出 */
.chart .cd{transform-box:fill-box;transform-origin:center;animation:candleIn .55s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i) * 22ms)}
@keyframes candleIn{from{opacity:0;transform:scaleY(0)}}

/* ——— 查询页动效：数据出现的一刻给足效果，操作时保持干净 ——— */
.page-glow{position:absolute;left:0;right:0;top:68px;height:520px;z-index:0;pointer-events:none;overflow:hidden;-webkit-mask-image:linear-gradient(#000 55%,transparent);mask-image:linear-gradient(#000 55%,transparent)}
.page-glow:before{content:"";position:absolute;inset:-40% -10%;background:radial-gradient(40% 55% at 22% 40%,rgba(224,189,130,.16),transparent 70%),radial-gradient(35% 50% at 78% 30%,rgba(95,212,244,.10),transparent 70%);animation:aurora 16s ease-in-out infinite alternate}
.page-glow .embers{position:absolute;inset:0;width:100%;height:100%}
@keyframes aurora{to{transform:translate(6%,-4%) rotate(8deg) scale(1.1)}}
main.wrap{position:relative;z-index:1}
.pg-h h1,.market-heading h1{background:linear-gradient(100deg,var(--ink) 0%,var(--ink) 40%,var(--gold2) 50%,var(--ink) 60%,var(--ink) 100%) 0 0/250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:goldSweepSoft 6s 1s linear infinite}
@keyframes goldSweepSoft{from{background-position:100% 0}to{background-position:-150% 0}}
.searchbar{transition:box-shadow .35s,border-color .35s}
.searchbar:focus-within{border-color:var(--gold-deep);box-shadow:var(--shadow),0 0 0 1px rgba(224,189,130,.35),0 0 50px rgba(224,189,130,.18)}
@keyframes itemIn{from{opacity:0;transform:translateY(16px) scale(.96);filter:blur(4px)}}
@keyframes rowIn{from{opacity:0;transform:translateX(-18px)}}
.result,.recent-item,.news-item,.equipment,.attribute,.growth-entry,.quote{animation:itemIn .55s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i,0) * 45ms)}
#listings tr{animation:rowIn .45s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i,0) * 30ms)}
#listings tr:first-child td{background:linear-gradient(90deg,rgba(224,189,130,.12),transparent 70%)}
#listings tr:first-child .listing-price{animation:priceGlow 2.4s ease-in-out infinite}
@keyframes priceGlow{50%{text-shadow:0 0 14px rgba(244,216,164,.8)}}
/* 角色卡：头像金环旋转，信息依次入场，数字滚动 */
.avatar-ring{position:relative;display:grid;place-items:center;flex:none;width:100px;height:100px;border-radius:50%}
.avatar-ring:before{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,transparent,var(--gold) 20%,transparent 40%,var(--data) 60%,transparent 80%);-webkit-mask:radial-gradient(circle,transparent 46px,#000 47px);mask:radial-gradient(circle,transparent 46px,#000 47px);animation:spin 5s linear infinite}
.avatar-ring .avatar{border-width:1px}
@keyframes spin{to{transform:rotate(1turn)}}
.profile-in .avatar-ring{animation:avatarIn .8s cubic-bezier(.2,.9,.3,1.3) both}
.profile-in .identity > *{animation:itemIn .6s cubic-bezier(.2,.8,.2,1) both}
.profile-in .identity > :nth-child(2){animation-delay:.08s}.profile-in .identity > :nth-child(3){animation-delay:.16s}
.profile-in .metric{animation:itemIn .6s cubic-bezier(.2,.8,.2,1) both}
.profile-in .metric:nth-child(2){animation-delay:.08s}.profile-in .metric:nth-child(3){animation-delay:.16s}.profile-in .metric:nth-child(4){animation-delay:.24s}
@keyframes avatarIn{from{opacity:0;transform:scale(.4) rotate(-90deg)}}
/* 高品质装备扫光 */
.equipment[class*=grade-legend],.equipment[class*=grade-mythic],.equipment[class*=grade-unique]{position:relative;overflow:hidden}
.equipment[class*=grade-legend]:after,.equipment[class*=grade-mythic]:after,.equipment[class*=grade-unique]:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.14) 50%,transparent 65%) -150% 0/250% 100% no-repeat;animation:gearSweep 4.5s ease-in-out infinite;animation-delay:calc(var(--i,0) * 160ms)}
@keyframes gearSweep{0%,40%{background-position:-150% 0}90%,100%{background-position:150% 0}}
.tabs button{transition:color .2s,border-color .25s}
/* 行情：走势最新价虚线与脉冲点，区服面板展开 */
.chart .last-line{stroke-dashoffset:0;animation:dash 1.2s linear infinite}
@keyframes dash{to{stroke-dashoffset:-20}}
.chart .last-pulse{transform-box:fill-box;transform-origin:center;animation:pulse 1.8s ease-out infinite}
@keyframes pulse{from{opacity:.55;transform:scale(.4)}to{opacity:0;transform:scale(2.2)}}
.quote:first-child{position:relative;overflow:hidden}
.quote:first-child:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 35%,rgba(244,216,164,.16) 50%,transparent 65%) -150% 0/250% 100% no-repeat;animation:gearSweep 3.6s ease-in-out infinite}
.srv-pick[open] .srv-panel{animation:panelIn .28s cubic-bezier(.2,.8,.2,1)}
@keyframes panelIn{from{opacity:0;transform:translateY(-8px) scale(.97)}}
dialog[open]{animation:dlgIn .35s cubic-bezier(.2,.8,.2,1)}
dialog[open]::backdrop{animation:fadeIn .3s}
@keyframes dlgIn{from{opacity:0;transform:translateY(20px) scale(.96)}}
@keyframes fadeIn{from{opacity:0}}
@media(max-width:760px){.avatar-ring{width:78px;height:78px}.avatar-ring:before{-webkit-mask:radial-gradient(circle,transparent 35px,#000 36px);mask:radial-gradient(circle,transparent 35px,#000 36px)}.page-glow{height:380px}}

.item-skill span{display:flex;align-items:center;gap:10px}.item-skill img{width:28px;height:28px;border-radius:6px;flex:none}

.chart-periods{display:inline-flex;gap:2px;padding:2px;margin-right:6px;border:1px solid var(--line);border-radius:8px;background:var(--bg2)}
.chart-periods button{min-height:26px;padding:0 10px;border:0;border-radius:6px;background:transparent;color:var(--muted);font:12px var(--sans);cursor:pointer}
.chart-periods button:hover{color:var(--ink)}
.chart-periods button[aria-pressed=true]{background:var(--surface);color:var(--gold2);box-shadow:inset 0 0 0 1px var(--line2)}
.chart-legend button.chart-legend-ma{display:inline-flex;align-items:center;gap:6px;padding:3px 6px;border:0;border-radius:6px;background:transparent;font:12px var(--sans);cursor:pointer}
.chart-legend button.chart-legend-ma:before{content:"";display:block;width:14px;height:3px;border-radius:2px;background:currentColor}
.chart-legend button.chart-legend-ma:hover{background:var(--bg2)}
.chart-legend button.chart-legend-ma[aria-pressed=false]{opacity:.38}
.chart-legend button.chart-legend-ma[aria-pressed=false]:before{background:transparent;box-shadow:inset 0 0 0 1px currentColor}
.chart-average-20{stroke:#c99be6}
.chart svg.static .cd{animation:none}
.chart svg[tabindex].dragging{cursor:grabbing}
.chart-axis-tag{fill:var(--data)}
.chart-axis-tag-text{fill:var(--gold-ink);font-size:11px;font-weight:700}
.chart-latest{position:absolute;right:104px;top:34px;z-index:2;min-height:28px;padding:0 12px;border:1px solid var(--gold-deep);border-radius:14px;background:rgba(24,29,28,.92);color:var(--gold2);font:12px var(--sans);cursor:pointer}
.chart-latest:hover{background:var(--surface)}
.chart-latest[hidden]{display:none}
.chart svg[tabindex]{user-select:none;-webkit-user-select:none}
.chart svg[tabindex]:focus:not(:focus-visible){outline:none}