-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
668 lines (622 loc) · 30.5 KB
/
Copy pathindex.html
File metadata and controls
668 lines (622 loc) · 30.5 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>涡潮攻略站 | 斯普拉遁：涂击队</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link href="https://fonts.googleapis.com/css2?family=ZCOOL+KuaiLe&family=Baloo+2:wght@500;700;800&family=Noto+Sans+SC:wght@400;500;700;900&display=swap" rel="stylesheet">
<style>
:root{
--ink-navy:#0b1826;
--panel:#122a3a;
--panel-2:#0f2230;
--cyan:#29d9c8;
--pink:#ff3e7f;
--gold:#f5b942;
--fog:#eaf3f2;
--fog-dim:#9db3b8;
--line: rgba(234,243,242,0.09);
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
background:var(--ink-navy);
color:var(--fog);
font-family:'Noto Sans SC', sans-serif;
line-height:1.6;
overflow-x:hidden;
}
::selection{ background:var(--pink); color:var(--ink-navy); }
h1,h2,h3,.brand{ font-family:'ZCOOL KuaiLe', 'Noto Sans SC', sans-serif; }
.num{ font-family:'Baloo 2', sans-serif; }
a{ color:inherit; text-decoration:none; }
/* ---------- layout shell ---------- */
.shell{
display:grid;
grid-template-columns: 260px 1fr;
min-height:100vh;
}
@media (max-width: 880px){
.shell{ grid-template-columns: 1fr; }
}
/* ---------- sidebar (loadout menu style) ---------- */
.sidebar{
position:sticky; top:0; height:100vh;
background:linear-gradient(180deg, var(--panel-2), #0a1620);
border-right:1px solid var(--line);
padding:28px 22px;
display:flex; flex-direction:column; gap:26px;
z-index:20;
}
.brand-row{
display:flex; align-items:center; justify-content:space-between; gap:12px;
}
.brand{
font-size:1.5rem; color:var(--fog);
display:flex; flex-direction:column; gap:2px;
}
.menu-toggle{
display:none;
flex-direction:column; justify-content:center; gap:5px;
width:38px; height:38px; border-radius:9px;
background:var(--panel); border:1px solid var(--line);
cursor:pointer; flex-shrink:0;
}
.menu-toggle span{
display:block; width:18px; height:2px; margin:0 auto;
background:var(--fog); border-radius:2px; transition:.2s ease;
}
.sidebar.open .menu-toggle span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.sidebar.open .menu-toggle span:nth-child(2){ opacity:0; }
.sidebar.open .menu-toggle span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }
.brand small{
font-family:'Noto Sans SC', sans-serif;
font-size:0.68rem; letter-spacing:.14em; color:var(--cyan); font-weight:700;
}
.brand .ink-dot{
display:inline-block; width:8px; height:8px; border-radius:50% 50% 50% 0;
background:var(--pink); margin-right:8px; transform:rotate(45deg);
}
.sidebar-body{ flex:1; min-height:0; }
.sidebar-body-inner{ display:flex; flex-direction:column; gap:26px; height:100%; }
nav.menu{ display:flex; flex-direction:column; gap:4px; }
nav.menu a{
display:flex; align-items:center; gap:10px;
padding:11px 12px; border-radius:10px;
font-size:0.92rem; color:var(--fog-dim); font-weight:500;
border:1px solid transparent;
transition:.18s ease;
}
nav.menu a .tag{
font-family:'Baloo 2',sans-serif; font-size:.72rem; color:var(--cyan);
width:22px; opacity:.7;
}
nav.menu a:hover{
background:rgba(41,217,200,0.08);
color:var(--fog);
border-color:var(--line);
}
nav.menu a:hover .tag{ color:var(--pink); opacity:1; }
.sidebar-foot{
margin-top:auto; font-size:.72rem; color:var(--fog-dim);
border-top:1px solid var(--line); padding-top:14px;
}
.status-chip{
display:inline-flex; align-items:center; gap:6px;
background:rgba(245,185,66,0.1); color:var(--gold);
border:1px solid rgba(245,185,66,0.3);
padding:4px 10px; border-radius:100px; font-size:.7rem; margin-bottom:8px;
}
.status-chip::before{ content:''; width:6px; height:6px; border-radius:50%; background:var(--gold); }
/* ---------- main ---------- */
main{ position:relative; }
/* HERO */
.hero{
position:relative;
padding:90px 60px 70px;
overflow:hidden;
border-bottom:1px solid var(--line);
}
@media (max-width:880px){ .hero{ padding:60px 24px 50px; } }
.whirlpool{
position:absolute; right:-160px; top:-140px;
width:620px; height:620px; border-radius:50%;
background:
conic-gradient(from 0deg,
var(--cyan) 0deg, transparent 40deg,
var(--pink) 90deg, transparent 130deg,
var(--gold) 180deg, transparent 230deg,
var(--cyan) 280deg, transparent 320deg, var(--cyan) 360deg);
filter: blur(2px);
opacity:.5;
-webkit-mask: radial-gradient(circle, transparent 34%, black 35%, black 60%, transparent 61%);
mask: radial-gradient(circle, transparent 34%, black 35%, black 60%, transparent 61%);
animation: spin 26s linear infinite;
pointer-events:none;
}
@keyframes spin{ to{ transform:rotate(360deg); } }
@media (prefers-reduced-motion: reduce){ .whirlpool{ animation:none; } }
.eyebrow{
display:inline-flex; align-items:center; gap:8px;
font-size:.78rem; letter-spacing:.12em; color:var(--cyan); font-weight:700;
margin-bottom:18px;
}
.eyebrow::before{ content:'涡潮情报局'; background:rgba(41,217,200,0.12); padding:5px 10px; border-radius:6px; }
.hero h1{
font-size:clamp(2.4rem, 5vw, 4.2rem);
line-height:1.05;
max-width:760px;
color:var(--fog);
}
.hero h1 .accent{ color:var(--pink); }
.hero p.lede{
max-width:560px; margin-top:20px; font-size:1.02rem; color:var(--fog-dim);
}
.fact-row{
display:flex; flex-wrap:wrap; gap:12px; margin-top:34px;
}
.fact-chip{
background:var(--panel);
border:1px solid var(--line);
padding:12px 16px; border-radius:12px;
min-width:130px;
}
.fact-chip .k{ font-size:.68rem; color:var(--fog-dim); letter-spacing:.06em; }
.fact-chip .v{ font-family:'Baloo 2',sans-serif; font-size:1.05rem; color:var(--fog); margin-top:2px; }
.fact-chip.hot .v{ color:var(--gold); }
/* SECTIONS */
section{ padding:64px 60px; border-bottom:1px solid var(--line); }
@media (max-width:880px){ section{ padding:48px 24px; } }
.section-head{ display:flex; align-items:baseline; gap:16px; margin-bottom:30px; flex-wrap:wrap; }
.section-head .idx{ font-family:'Baloo 2',sans-serif; color:var(--pink); font-size:1rem; }
.section-head h2{ font-size:1.9rem; color:var(--fog); }
.section-head .desc{ color:var(--fog-dim); font-size:.9rem; margin-top:6px; flex-basis:100%; max-width:640px; }
.card-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(230px,1fr)); gap:18px; }
.card{
background:var(--panel); border:1px solid var(--line); border-radius:16px;
padding:22px; position:relative; overflow:hidden;
}
.card::before{
content:''; position:absolute; top:-30px; right:-30px; width:80px; height:80px;
background:var(--cyan); opacity:.08; border-radius:50% 50% 50% 0; transform:rotate(45deg);
}
.card h3{ font-size:1.05rem; color:var(--fog); margin-bottom:8px; font-family:'Noto Sans SC'; font-weight:700; }
.card p{ font-size:.88rem; color:var(--fog-dim); }
.card .badge{
display:inline-block; margin-top:12px; font-size:.7rem; color:var(--gold);
border:1px dashed rgba(245,185,66,0.4); padding:3px 8px; border-radius:100px;
}
/* split (character section) */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:36px; }
@media (max-width:760px){ .split{ grid-template-columns:1fr; } }
.persona{ background:var(--panel); border:1px solid var(--line); border-radius:18px; padding:26px; }
.persona .role{ font-size:.72rem; color:var(--cyan); letter-spacing:.1em; margin-bottom:10px; font-weight:700; }
.persona h3{ font-size:1.3rem; margin-bottom:10px; color:var(--fog); }
.persona p{ color:var(--fog-dim); font-size:.9rem; }
/* islands */
.island-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px; }
.island{
border:1px solid var(--line); border-radius:14px; padding:18px;
background:linear-gradient(160deg, var(--panel), var(--panel-2));
}
.island .tier{ font-family:'Baloo 2'; font-size:.75rem; color:var(--pink); }
.island h3{ font-size:1rem; margin:8px 0 6px; }
.island p{ font-size:.82rem; color:var(--fog-dim); }
/* tabs (build guide) */
.tabs{ display:flex; gap:8px; margin-bottom:22px; flex-wrap:wrap; }
.tab-btn{
padding:9px 16px; border-radius:100px; border:1px solid var(--line);
background:var(--panel); font-size:.85rem; color:var(--fog-dim); cursor:pointer;
font-family:'Noto Sans SC'; transition:.15s;
}
.tab-btn.active{ background:var(--pink); color:var(--ink-navy); border-color:var(--pink); font-weight:700; }
.tab-panel{ display:none; }
.tab-panel.active{ display:block; }
/* score section */
.score-board{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:20px; }
.score{ background:var(--panel); border:1px solid var(--line); border-radius:16px; padding:22px; }
.score .outlet{ font-size:.82rem; color:var(--fog-dim); margin-bottom:10px; }
.score .bar-track{ height:8px; background:var(--panel-2); border-radius:100px; overflow:hidden; margin-bottom:10px;}
.score .bar-fill{ height:100%; background:linear-gradient(90deg, var(--cyan), var(--pink)); border-radius:100px; }
.score .val{ font-family:'Baloo 2'; font-size:1.6rem; color:var(--gold); }
/* placeholder note */
.todo{
border:1px dashed rgba(255,62,127,0.4); background:rgba(255,62,127,0.06);
border-radius:12px; padding:16px 18px; font-size:.85rem; color:var(--fog-dim);
margin-top:20px;
}
.todo b{ color:var(--pink); }
footer{
padding:36px 60px; font-size:.8rem; color:var(--fog-dim);
display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
}
@media (max-width:880px){ footer{ padding:28px 24px; } }
/* ---------- mobile sidebar override (kept last on purpose) ---------- */
@media (max-width: 880px){
.sidebar{
position:sticky; top:0; height:auto; width:100%;
padding:16px 20px;
gap:0;
border-right:none; border-bottom:1px solid var(--line);
z-index:50;
}
.menu-toggle{ display:flex; }
.brand{ font-size:1.15rem; }
.brand small{ font-size:.6rem; }
.sidebar-body{
display:grid; grid-template-rows:0fr; overflow:hidden;
transition:grid-template-rows .25s ease;
}
.sidebar-body-inner{ overflow:hidden; min-height:0; gap:18px; }
.sidebar.open .sidebar-body{ grid-template-rows:1fr; margin-top:18px; }
nav.menu{ gap:2px; }
nav.menu a{ padding:13px 12px; }
}
</style>
</head>
<body>
<div class="shell">
<!-- SIDEBAR -->
<aside class="sidebar" id="sidebar">
<div class="brand-row">
<div class="brand">
<span><span class="ink-dot"></span>涡潮攻略局</span>
<small>SPLATOON RAIDERS · UNOFFICIAL WIKI</small>
</div>
<button class="menu-toggle" id="menuToggle" aria-label="展开导航菜单" aria-expanded="false">
<span></span><span></span><span></span>
</button>
</div>
<div class="sidebar-body" id="sidebarBody">
<div class="sidebar-body-inner">
<nav class="menu">
<a href="#hero"><span class="tag">00</span>首页</a>
<a href="#start"><span class="tag">01</span>新手指南</a>
<a href="#cast"><span class="tag">02</span>主角与阵营</a>
<a href="#islands"><span class="tag">03</span>涡潮群岛</a>
<a href="#build"><span class="tag">04</span>装备与构筑</a>
<a href="#treasure"><span class="tag">05</span>宝藏与头衔</a>
<a href="#salmonid"><span class="tag">06</span>鲑鱼图鉴</a>
<a href="#reviews"><span class="tag">07</span>评测汇总</a>
<a href="#buy"><span class="tag">08</span>购买与周边</a>
<a href="#log"><span class="tag">09</span>更新日志</a>
</nav>
<div class="sidebar-foot">
<div class="status-chip">今日发售 · 内容持续更新中</div>
<div>本站为玩家自制攻略资料，与任天堂无官方关联。</div>
</div>
</div>
</div>
</aside>
<!-- MAIN -->
<main>
<section class="hero" id="hero">
<div class="whirlpool"></div>
<div class="eyebrow"></div>
<h1>涡潮群岛的宝藏，<br>不会自己游到你手里。<span class="accent">机械师</span>，出发吧。</h1>
<p class="lede">《斯普拉遁：涂击队》系列首部外传作品攻略站——新手上手、机械师与鱼浆帮资料、群岛地图、装备构筑与鲑鱼图鉴，一站查完。</p>
<div class="fact-row">
<div class="fact-chip"><div class="k">发售日期</div><div class="v">2026.07.23</div></div>
<div class="fact-chip"><div class="k">平台</div><div class="v">Switch 2 独占</div></div>
<div class="fact-chip"><div class="k">游玩人数</div><div class="v">单人 / 2–4人协力</div></div>
<div class="fact-chip"><div class="k">主线时长</div><div class="v">约 20 小时 +终局内容</div></div>
<div class="fact-chip"><div class="k">武器种类</div><div class="v">100+ 种</div></div>
<div class="fact-chip hot"><div class="k">Metacritic 均分</div><div class="v">80 / 100</div></div>
</div>
</section>
<!-- 01 新手指南 -->
<section id="start">
<div class="section-head">
<span class="idx num">01</span>
<h2>新手指南</h2>
<div class="desc">第一次登岛该做什么、单人和联机怎么选、核心循环是什么——先把地基打好。</div>
</div>
<div class="card-grid">
<div class="card">
<h3>三种难度，随时可调</h3>
<p>游戏提供「游客」（休闲）、「涂袭者」（标准）、「生存专家」（挑战）三档难度，可在藏身船上随时切换。三档难度下战利品完全相同，区别只在于鲑鱼的强度，所以先挑轻松的难度熟悉系统完全没问题。</p>
</div>
<div class="card">
<h3>单人 vs 协力，怎么选</h3>
<p>本作可完全单人通关，也支持最多 4 人（含自己）本地或在线组队寻宝、推进剧情；在线联机需要 Nintendo Switch Online 会员。为保证体验均衡，敌人强度会随人数调整。</p>
</div>
<div class="card">
<h3>单人也不孤单：求援机制</h3>
<p>即使一个人玩，遇到打不过的场面也可以向线上其他玩家发出求援，获得临时支援；用过一次后需要等待一段时间才能再次请求。反过来你也可以去帮别人完成求援拿奖励。</p>
</div>
<div class="card">
<h3>核心循环：探索 → 寻宝 → 战斗强化</h3>
<p>以「基地船」为据点，前往涡潮群岛的各个地下城探索寻宝，沿途教训狂暴鲑鱼；带回宝物评估价值获得头衔，再用材料强化武器与装备后继续出击。</p>
</div>
<div class="card">
<h3>基地船三件套</h3>
<p>鱼浆帮三名成员分别在基地驻守：道具工坊帮你打造新道具、武器库帮你升级武器或拆解成材料、还有专门负责给你带来更多情报，记得逐步升级这些设施。</p>
</div>
<div class="card">
<h3>初期打法建议</h3>
<p>占位——具体的新手武器推荐、前几个地下城的推荐顺序、常见翻车场景，建议实际上手后再补充，这里先不编数据。</p>
<span class="badge">待补充</span>
</div>
</div>
<div class="todo">
<b>说明：</b>本节机制描述基于任天堂直面会与官方公开信息整理；标注"待补充"的部分需要实际上手体验后填写，避免编造误导玩家。
</div>
</section>
<!-- 02 主角与阵营 -->
<section id="cast">
<div class="section-head">
<span class="idx num">02</span>
<h2>主角与阵营</h2>
<div class="desc">全新视角，老朋友同行。</div>
</div>
<div class="split">
<div class="persona">
<div class="role">主角</div>
<h3>机械师</h3>
<p>一位手很巧的年轻人，与鱼浆帮一起以「基地船」为据点，在涡潮群岛过着每天寻宝的日子。战斗中可使用多种「配件」武器，随战斗推进不断升级、自由定制装备构筑。</p>
</div>
<div class="persona">
<div class="role">同行阵营</div>
<h3>鱼浆帮</h3>
<p>《斯普拉遁3》中广受欢迎的偶像组合，成员为曼曼、莎莎、鬼福三人。每次出击前可选择其中一人同行，她们会驾驶调查机甲为你提供支援——协助攻击、化身跳台，甚至下机甲释放专属技能，具体选谁最好根据当次遇到的鲑鱼类型来定。</p>
</div>
</div>
<div class="card-grid" style="margin-top:18px;">
<div class="card">
<h3>好感度系统</h3>
<p>随着与同行伙伴反复出击冒险，彼此的关系会逐渐加深，鱼浆帮成员也会讲述各种各样的故事，是主线剧情外的重要养成线。</p>
</div>
<div class="card">
<h3>时装与 Amiibo</h3>
<p>沿袭系列传统，游戏提供大量可搭配的服装用来展现风格，也可以通过 Amiibo 解锁独占时装。</p>
</div>
</div>
</section>
<!-- 03 群岛 -->
<section id="islands">
<div class="section-head">
<span class="idx num">03</span>
<h2>涡潮群岛</h2>
<div class="desc">冒险的舞台——一组充满谜团的漩涡群岛（海外资料中也被称为 Spirhalite 群岛），是宝藏与狂暴鲑鱼共存的地方。</div>
</div>
<div class="card-grid">
<div class="card">
<h3>基地船</h3>
<p>机械师与鱼浆帮的共同据点，每天从这里出发寻宝。船上设有道具工坊、武器库等设施，是强化装备、切换难度、组队出击的枢纽。</p>
</div>
<div class="card">
<h3>地下城与鲑鱼等级</h3>
<p>群岛上的每个地下城都有各自的「鲑鱼等级」，等级越高，鲑鱼越强，能获得的武器品质也越好——这是决定"去哪个地下城刷装备"的核心指标。</p>
</div>
<div class="card">
<h3>具体岛屿与地图细节</h3>
<p>占位——目前公开资料尚未细化到具体岛屿名称与地形图，建议实际探索后补充，并注明信息来源（官方 / 社区实测）。</p>
<span class="badge">待补充</span>
</div>
</div>
</section>
<!-- 04 装备构筑 -->
<section id="build">
<div class="section-head">
<span class="idx num">04</span>
<h2>装备与构筑</h2>
<div class="desc">给硬核玩家的部分——武器搭配、技能取舍、构筑思路。</div>
</div>
<div class="tabs">
<button class="tab-btn active" data-tab="t1">武器</button>
<button class="tab-btn" data-tab="t2">技能装备</button>
<button class="tab-btn" data-tab="t3">推荐构筑</button>
</div>
<div class="tab-panel active" id="t1">
<div class="card-grid">
<div class="card">
<h3>100+ 种武器，边打边捡</h3>
<p>游戏内共有超过 100 种武器可供发现。击败鲑鱼怪后有机会掉落武器，等级越高攻击力越强，偶尔还能捡到带特殊能力的稀有武器。</p>
</div>
<div class="card">
<h3>用涡潮碎片强化</h3>
<p>随主线推进，可以用「涡潮碎片」强化手上的武器。找到心仪的武器后记得优先强化，而不是急着换新的。</p>
</div>
<div class="card">
<h3>按地下城鲑鱼等级刷装备</h3>
<p>每个地下城都有对应的鲑鱼等级，等级越高掉落的武器越强力，是决定"去哪刷"的关键参考。</p>
<span class="badge">具体武器列表待补充</span>
</div>
</div>
</div>
<div class="tab-panel" id="t2">
<div class="card-grid">
<div class="card">
<h3>贮墨槽：装备的总称</h3>
<p>本作的装备统称「贮墨槽」，分为力量型、速度型、战术型三种，每种贮墨槽可附加两个装备，可选装备取决于贮墨槽类型。</p>
</div>
<div class="card">
<h3>速度型 · 机动突进</h3>
<p>强调快速移动、迅速战斗与躲避。例如爆破靴可高速向前跳跃并攻击，也能用来撤退；此外还有冲刺炸弹、回旋镖等技能。</p>
</div>
<div class="card">
<h3>力量型 · 正面迎击</h3>
<p>适合硬钢成群敌人。例如喷墨炮会在身边旋转并喷射墨水攻击、覆盖地面；旋转轮前进时旋转喷墨、击退接触到的鲑鱼，还能锁定头目鲑鱼移动。</p>
</div>
<div class="card">
<h3>战术型 · 策略布置</h3>
<p>更偏向运筹布局。例如可部署自动攻击的炮塔「射击罐」；或是能相互连接、在你射击时引发大爆炸的炸弹怪。</p>
</div>
<div class="card">
<h3>技能点与装备部件</h3>
<p>升级贮墨槽需要技能点，可用于提升生命值、武器攻击力、装备攻击力和装备消耗上限。此外还能获得装备部件，插到装备插槽上附加被动能力，比如提升伤害、射速、持续时间，或附加墨水爆炸、击退等效果。</p>
</div>
</div>
</div>
<div class="tab-panel" id="t3">
<div class="card"><h3>推荐构筑</h3><p>占位——面向新手的稳健构筑、面向高难度「生存专家」的进阶构筑，需要实际打过之后再总结，暂不编造具体搭配。</p><span class="badge">待补充</span></div>
</div>
</section>
<!-- 05 宝藏与头衔 -->
<section id="treasure">
<div class="section-head">
<span class="idx num">05</span>
<h2>宝藏与头衔</h2>
<div class="desc">寻宝不只是为了好看，还是变强的另一条路径。</div>
</div>
<div class="card-grid">
<div class="card">
<h3>鲑鱼圣物</h3>
<p>寻宝过程中获得的宝物「鲑鱼圣物」可以提升宝物之力。部分圣物能装备在所有贮墨槽上，部分只能装备在特定类型的贮墨槽上，但都会提供对冒险有用的效果。</p>
</div>
<div class="card">
<h3>解除贮墨槽限制</h3>
<p>强化贮墨槽并解除其限制，可以增加能装备的宝物之力数量，是构筑养成的重要一环。</p>
</div>
<div class="card">
<h3>头衔系统</h3>
<p>带回宝物时，系统会按总价值进行评估并授予相应头衔；头衔还能提升获得涡潮碎片的效率，等于是"寻宝越认真、强化越快"。</p>
</div>
</div>
</section>
<!-- 06 鲑鱼图鉴 -->
<section id="salmonid">
<div class="section-head">
<span class="idx num">06</span>
<h2>鲑鱼图鉴</h2>
<div class="desc">群岛上蠢蠢欲动的狂暴鲑鱼——认清弱点，别被偷袭。</div>
</div>
<div class="card-grid">
<div class="card">
<h3>小型鲑鱼怪</h3>
<p>单独作战威胁不大，但会成群结队地攻击，小心不要被数量淹没——这是本作最基础也最常见的敌人类型。</p>
</div>
<div class="card">
<h3>头目鲑鱼怪</h3>
<p>更强大的鲑鱼，拥有独特的优势与弱点，其中一部分原型来自《斯普拉遁》系列「鲑鱼打工」中登场过的头目。击败后可获得「超级能量蛋」，作为强化机甲的能量来源。</p>
</div>
<div class="card">
<h3>老练鲑鱼怪</h3>
<p>鲑鱼怪进化的巅峰形态，机制上与头目鲑鱼怪类似但更加凶猛，需要善用武器与技能搭配才能击败——也是守护到手宝藏的最后一道关卡。</p>
</div>
</div>
<div class="todo"><b>说明：</b>具体某只头目鲑鱼的打法拆解（弱点部位、攻击前摇等）建议实战后补充，这里先给出官方确认的分类框架。</div>
</section>
<!-- 07 评测汇总 -->
<section id="reviews">
<div class="section-head">
<span class="idx num">07</span>
<h2>评测汇总</h2>
<div class="desc">首发媒体评分参考，Metacritic 均分 80/100，评价整体两极但偏正面。</div>
</div>
<div class="score-board">
<div class="score">
<div class="outlet">IGN</div>
<div class="bar-track"><div class="bar-fill" style="width:90%"></div></div>
<div class="val">9<span style="font-size:.9rem;color:var(--fog-dim)">/10</span></div>
</div>
<div class="score">
<div class="outlet">Nintendo Life / Nintendo Insider / Gfinity</div>
<div class="bar-track"><div class="bar-fill" style="width:90%"></div></div>
<div class="val">9<span style="font-size:.9rem;color:var(--fog-dim)">/10</span></div>
</div>
<div class="score">
<div class="outlet">Pocket Tactics / TechRadar Gaming</div>
<div class="bar-track"><div class="bar-fill" style="width:100%"></div></div>
<div class="val">10<span style="font-size:.9rem;color:var(--fog-dim)">/10</span></div>
</div>
<div class="score">
<div class="outlet">GameSpot</div>
<div class="bar-track"><div class="bar-fill" style="width:80%"></div></div>
<div class="val">8<span style="font-size:.9rem;color:var(--fog-dim)">/10</span></div>
</div>
<div class="score">
<div class="outlet">The Guardian（目前最低分）</div>
<div class="bar-track"><div class="bar-fill" style="width:40%"></div></div>
<div class="val">4<span style="font-size:.9rem;color:var(--fog-dim)">/10</span></div>
</div>
<div class="score">
<div class="outlet">Metacritic 媒体均分</div>
<div class="bar-track"><div class="bar-fill" style="width:80%"></div></div>
<div class="val">80<span style="font-size:.9rem;color:var(--fog-dim)">/100</span></div>
</div>
</div>
<div class="card-grid" style="margin-top:22px;">
<div class="card">
<h3>好评方怎么说</h3>
<p>IGN 认为这是系列迄今战役故事最好的一作，关卡类型丰富、难度曲线合理，且没有为了凑时长而堆砌无意义的刷级；随主线推进，技能自定义系统会不断加深，长约 20 小时的主线之外还有强度不低的终局内容，并支持无缝联机。GameSpot 则指出战役叙事比过去的主线作品更进一步，角色自定义与关卡节奏是亮点，不足是部分玩家熟悉的经典武器在新模式里不算好用。</p>
</div>
<div class="card">
<h3>差评方怎么说</h3>
<p>目前分数最低的《卫报》认为玩法偏平庸，与其他现代合作动作游戏相似度较高：升级装备、比较数值、技能搭配反复投入战斗，随着数值和武器库积累，敌人潮会逐渐变得好对付，体验趋于乏味。评测者还提到，系列一向以独特风格著称，这次为了照顾更广泛的受众而有所收敛。</p>
</div>
</div>
</section>
<!-- 08 购买与周边 -->
<section id="buy">
<div class="section-head">
<span class="idx num">08</span>
<h2>购买与周边</h2>
<div class="desc">发售信息与联动活动，具体价格以当地商店/eShop 实时显示为准。</div>
</div>
<div class="card-grid">
<div class="card">
<h3>发售形式</h3>
<p>提供实体盒装与数字下载版，Switch 2 平台独占。港服参考建议零售价约为盒装 HKD 429 / 数字版 HKD 379，实际请以当地 eShop 及零售渠道为准。</p>
</div>
<div class="card">
<h3>主题周边</h3>
<p>同步推出以鱼浆帮为主题的 Joy-Con 2 新配色（蓝 / 浅黄）。</p>
</div>
<div class="card">
<h3>《斯普拉遁3》联动祭典</h3>
<p>为纪念本作发售，《斯普拉遁3》曾于 7 月 11 日至 13 日举办联动祭典，主题为"最强的是？速度 vs 力量 vs 技术"，呼应本作的三种贮墨槽类型。</p>
</div>
</div>
</section>
<!-- 09 更新日志 -->
<section id="log">
<div class="section-head">
<span class="idx num">09</span>
<h2>更新日志</h2>
<div class="desc">攻略站自身的更新记录，方便老读者知道有什么新内容。</div>
</div>
<div class="card-grid">
<div class="card">
<h3>2026.07.23 — 内容大幅扩充</h3>
<p>补充难度模式、求援机制、贮墨槽三型详细机制、鲑鱼圣物与头衔系统、鲑鱼三级图鉴、完整评测汇总（含正反两方观点）、购买与周边信息。仍标注"待补充"的部分为具体地下城地图、精确武器列表与推荐构筑，需要实机数据支撑，暂不编造。</p>
</div>
<div class="card">
<h3>2026.07.23 — 首发上线</h3>
<p>MVP 框架搭建：导航结构、首发事实、评分汇总。</p>
</div>
</div>
</section>
<footer>
<span>© 2026 涡潮攻略局 · 玩家自制，非官方内容</span>
<span>数据持续修订中</span>
</footer>
</main>
</div>
<script>
const sidebarEl = document.getElementById('sidebar');
const menuToggle = document.getElementById('menuToggle');
if(menuToggle){
menuToggle.addEventListener('click', ()=>{
const isOpen = sidebarEl.classList.toggle('open');
menuToggle.setAttribute('aria-expanded', isOpen ? 'true' : 'false');
});
document.querySelectorAll('#sidebarBody a').forEach(link=>{
link.addEventListener('click', ()=>{
sidebarEl.classList.remove('open');
menuToggle.setAttribute('aria-expanded','false');
});
});
}
document.querySelectorAll('.tab-btn').forEach(btn=>{
btn.addEventListener('click', ()=>{
document.querySelectorAll('.tab-btn').forEach(b=>b.classList.remove('active'));
document.querySelectorAll('.tab-panel').forEach(p=>p.classList.remove('active'));
btn.classList.add('active');
document.getElementById(btn.dataset.tab).classList.add('active');
});
});
</script>
</body>
</html>