html{scroll-behavior:smooth;scroll-padding-top:28px}
.guide-page{--paper:var(--site-dark);--ink:var(--site-paper);--muted:var(--site-muted);--line:var(--site-line);--accent:var(--site-jade);--dark:var(--site-panel)}
.guide-hero{display:flex;justify-content:space-between;align-items:center;gap:50px;max-width:none;margin:0;padding:76px var(--site-gutter);min-height:390px;background:linear-gradient(90deg,#050e0df5 10%,#050e0dbb 55%,#050e0d55),url('/assets/web/art-deployment-crafted-watch-room.4fe179106079a038.webp') center 45%/cover;border-bottom:1px solid var(--line)}.guide-hero h1{font-size:clamp(38px,4.6vw,64px);line-height:1.35;letter-spacing:-2px;margin:25px 0}.guide-hero h1 em{font-style:normal;color:#a8c6b2}.guide-hero>div>p:last-child{color:var(--muted);font-size:14px}.guide-cover{width:200px;min-height:246px;flex:none;background:linear-gradient(135deg,#18372ddd,#071310eb);color:var(--muted);padding:28px;transform:rotate(3deg);border:1px solid #95bda355;box-shadow:8px 12px 24px #0004}.guide-cover>span,.guide-cover>small{font:9px/1.7 ui-monospace,monospace;letter-spacing:1.2px}.guide-cover strong{display:block;font-family:var(--site-title-font)!important;font-weight:400;font-size:65px;letter-spacing:-5px;line-height:1.4;margin:18px 0;color:#eac38a}
.guide-layout{display:grid;grid-template-columns:200px minmax(0,1fr);gap:clamp(32px,4vw,72px);max-width:none;padding:52px var(--site-gutter) 70px;margin:auto}.guide-sidebar{position:sticky;top:28px;align-self:start;border-top:1px solid var(--line);padding-top:20px}.guide-sidebar nav>p{font-size:11px;color:var(--muted);margin:0 0 12px}.guide-sidebar nav>a{display:flex;align-items:center;gap:13px;min-height:44px;font-size:12px;border-bottom:1px solid var(--line)}.guide-sidebar nav>a>span{font:9px ui-monospace,monospace;color:var(--accent)}.guide-sidebar nav>a:hover{color:var(--accent);background:#a7e3d50d}.guide-back{display:flex;align-items:center;gap:8px;font-size:11px;margin-top:28px;color:var(--muted)}.guide-content{min-width:0}.guide-content>section{padding:45px 0 55px;border-top:1px solid var(--line);scroll-margin-top:24px}.guide-content>section:first-child{padding-top:25px;border-top:1px solid var(--line)}.guide-section-heading{margin-bottom:28px}.guide-section-heading h2{font-size:29px;line-height:1.4;letter-spacing:-1.1px;margin:12px 0}.guide-section-heading>p:last-child{font-size:13px;color:var(--muted);margin-bottom:0}
.start-steps{padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;list-style:none}.start-steps>li>span{font:12px ui-monospace,monospace;color:var(--accent)}.start-steps h3{font-size:16px;line-height:1.5;margin:15px 0 10px}.start-steps p{font-size:12px;color:var(--muted)}.guide-note{background:#10251e;padding:20px 24px;border-left:2px solid #6b9b88;font-size:12px;margin:24px 0 0;color:#c8d9c7}.guide-note p{margin:8px 0 0}.guide-note a,.guide-tip a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}.guide-tip{font-size:12px;color:var(--muted);margin:22px 0 0;line-height:1.9}
.guide-roles{display:grid;gap:18px}.guide-role{display:grid;grid-template-columns:120px minmax(0,1fr);gap:25px;border-top:1px solid var(--line);padding:22px 0}.guide-role>img{border:1px solid var(--line);width:120px;height:150px;object-fit:cover;object-position:center 25%;background:#0d211b}.entry-no{font:9px ui-monospace,monospace;letter-spacing:1px;color:#9fb5a6}.guide-role h3{font-size:22px;margin:8px 0}.guide-role p{font-size:12px;color:var(--muted);margin-bottom:9px}.guide-role .role-loadout{color:#eac38a;font-size:11px}.guide-role details{margin-top:15px}.guide-role summary{font-size:11px;cursor:pointer;min-height:30px;padding:5px 0}.guide-role details[open] summary{margin-bottom:10px;color:var(--accent)}
.guide-weapons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}.guide-weapon{padding:25px 22px;background:linear-gradient(135deg,#0d211b,#091915)}.guide-skill{display:block;width:52px;height:52px;background:url('/assets/web/art-skills.1e3bf71c00291966.webp') var(--icon-x) var(--icon-y)/600% 300% no-repeat;filter:drop-shadow(0 3px 5px #0003);margin-bottom:14px}.guide-skill.skill-water{background-image:url('/assets/web/art-water-controls.3f963c5302cbed43.webp');background-size:200% 100%;background-position:0 0}.guide-weapon h3{font-size:15px;margin-bottom:8px}.guide-weapon p{font-size:12px;color:var(--muted);margin:0}.guide-disclosure{margin-top:25px;border-block:1px solid var(--line)}.guide-disclosure>summary{font-weight:650;font-size:13px;cursor:pointer;padding:19px 0;line-height:1.7}.guide-disclosure[open]>summary{color:var(--accent)}.passive-list{margin:0 0 24px}.passive-list>div{display:grid;grid-template-columns:120px minmax(0,1fr);gap:14px;padding:13px 0;border-top:1px solid var(--line)}.passive-list dt{font-size:12px;font-weight:650}.passive-list dd{font-size:12px;color:var(--muted);margin:0;line-height:1.8}.specialization-note{margin-top:28px;padding:26px;background:#10251e}.specialization-note h3{font-size:17px;line-height:1.5}.specialization-note p:not(.eyebrow),.specialization-note li{font-size:12px;color:#b8c7ba}.specialization-note ul{list-style:none;padding:0;margin:0;line-height:2.3}.specialization-note li b{display:inline-block;min-width:65px}
.evolution-group{border-bottom:1px solid var(--line)}.evolution-group:first-of-type{margin-top:25px;border-top:1px solid var(--line)}.evolution-group>summary{display:flex;align-items:center;justify-content:space-between;padding:23px 0;cursor:pointer;list-style:none}.evolution-group>summary::-webkit-details-marker{display:none}.evolution-group>summary b{font-size:17px}.evolution-group>summary small{margin-left:12px;color:var(--muted);font-size:11px}.details-sign{font-size:24px;line-height:1;color:var(--accent)}.evolution-group[open] .details-sign{transform:rotate(45deg)}.group-copy{font-size:12px;color:var(--muted);margin:0 0 16px}.recipe-list{list-style:none;margin:0 0 20px;padding:0}.recipe-list>li{display:grid;grid-template-columns:155px minmax(0,1fr);gap:20px;padding:19px 0;border-top:1px solid var(--line)}.recipe-list h3{font-size:15px;margin:0 0 7px}.recipe-owner{font-size:10px;color:#eac38a}.recipe-list p{font-size:12px;color:var(--muted);margin:6px 0 0}.recipe-list .recipe-materials{color:var(--ink);margin-top:0}.recipe-materials b{font-size:10px;white-space:nowrap;color:#eac38a}.recipe-materials span{padding-inline:3px;color:#9fb5a6}
.guide-timeline{padding:0;list-style:none;margin:0}.guide-timeline>li{display:grid;grid-template-columns:135px minmax(0,1fr);gap:20px;padding:0 0 25px}.guide-timeline time{font:11px/1.7 ui-monospace,monospace;color:var(--accent);padding-top:2px}.guide-timeline>li>div{border-left:2px solid #426c5b;padding:0 0 0 22px}.guide-timeline h3{font-size:16px;margin:0 0 9px}.guide-timeline p,.enemy-notes p{font-size:12px;color:var(--muted);margin:0}.enemy-notes{display:grid;gap:16px;padding-bottom:24px}.support-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.support-number{font-size:35px;letter-spacing:-1.5px;color:#a7e3d5;font-weight:750}.support-grid h3{font-size:16px;margin:14px 0 8px}.support-grid p{font-size:12px;color:var(--muted)}.relief-guide{border:1px solid var(--line);background:var(--dark);color:var(--ink);padding:28px;margin-top:24px}.relief-guide h3{font-size:21px;margin-bottom:12px}.relief-guide p{font-size:12px;color:#b8c7ba}.relief-guide dl>div{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #fff2;padding:15px 0;font-size:12px}.relief-guide dd{margin:0;color:#d8e7d4;line-height:1.8}.relief-guide dt{white-space:nowrap}.relief-guide .guide-tip{color:#b8c7ba}.join-steps{font-size:12px;color:var(--muted);line-height:2;padding-left:22px;margin-top:0}.guide-disclosure>.guide-tip{margin-bottom:24px}.control-list{margin:0}.control-list>div{display:grid;grid-template-columns:170px minmax(0,1fr);gap:20px;border-bottom:1px solid var(--line);padding:16px 0;font-size:12px}.control-list dd{margin:0;color:var(--muted);line-height:1.8}kbd{font:11px/1.6 ui-monospace,monospace;display:inline-block;padding:2px 7px;border:1px solid #95bda355;border-radius:3px;color:inherit;background:#fff1}.guide-content>.guide-final{padding:35px;background:linear-gradient(125deg,#153328,#091915);border:7px solid transparent;border-image:var(--site-jade-button) 20 58 / 7px / 0 stretch}.guide-final h2{font-size:26px;letter-spacing:-1px;line-height:1.5}
@media(max-width:1050px){.guide-layout{grid-template-columns:170px minmax(0,1fr);gap:32px;padding-inline:var(--site-gutter)}.guide-hero{padding-inline:var(--site-gutter)}.guide-cover{width:165px;padding:20px}.guide-cover strong{font-size:53px}.start-steps{grid-template-columns:1fr;gap:10px}.start-steps li{position:relative;padding-left:35px}.start-steps li>span{position:absolute;left:0;top:5px}.start-steps h3{margin-top:0}.guide-weapons{grid-template-columns:repeat(2,minmax(0,1fr))}.recipe-list>li{grid-template-columns:130px minmax(0,1fr)}.guide-timeline>li{grid-template-columns:110px minmax(0,1fr)}.guide-section-heading h2{font-size:26px}.support-grid{gap:16px}.support-grid h3{font-size:14px}}
@media(max-width:760px){html{scroll-padding-top:80px}.guide-hero{padding:48px 22px 36px}.guide-hero h1{font-size:clamp(30px,6.7vw,45px);letter-spacing:-1.5px;line-height:1.35;margin:18px 0}.guide-hero>div>p:last-child{font-size:12px}.guide-cover{display:none}.guide-layout{display:block;padding:0 var(--site-gutter) 40px}.guide-sidebar{position:sticky;top:0;z-index:5;margin:0 -22px 28px;padding:0;border:0;background:var(--paper);box-shadow:0 1px 0 var(--line)}.guide-sidebar nav{display:flex;gap:22px;overflow-x:auto;padding:0 22px;scrollbar-width:thin}.guide-sidebar nav>a{flex:none;min-height:54px;border:0;gap:7px;font-size:11px}.guide-sidebar nav>p,.guide-back{display:none}.guide-content>section{padding:28px 0 38px;scroll-margin-top:75px}.guide-content>section:first-child{padding-top:25px}.guide-section-heading h2{font-size:24px;letter-spacing:-.8px}.guide-section-heading>p:last-child{font-size:12px}.guide-role{grid-template-columns:80px minmax(0,1fr);gap:17px}.guide-role>img{border:1px solid var(--line);width:80px;height:112px}.guide-role h3{font-size:20px}.guide-role p{font-size:12px}.entry-no{font-size:8px}.guide-weapons{grid-template-columns:repeat(2,minmax(0,1fr))}.guide-weapon{padding:18px 14px}.guide-weapon h3{font-size:14px}.guide-weapon p{font-size:11px}.guide-skill{width:44px;height:44px}.guide-note{padding:18px;font-size:12px}.passive-list>div{grid-template-columns:95px minmax(0,1fr);gap:10px}.specialization-note{padding:20px}.specialization-note h3{font-size:16px}.specialization-note li b{display:block}.specialization-note li{margin-bottom:8px}.recipe-list>li{grid-template-columns:1fr;gap:10px}.recipe-list>li>div:first-child{display:flex;justify-content:space-between;align-items:baseline;gap:10px}.recipe-list h3{font-size:15px}.recipe-owner{font-size:9px}.evolution-group>summary{padding:21px 0}.evolution-group>summary b{font-size:16px}.guide-timeline>li{grid-template-columns:1fr;gap:9px;padding-bottom:24px}.guide-timeline>li>div{padding-left:15px}.guide-timeline h3{font-size:15px}.support-grid{grid-template-columns:1fr;gap:16px}.support-grid article{display:grid;grid-template-columns:75px minmax(0,1fr);column-gap:16px;border-bottom:1px solid var(--line);padding-bottom:17px}.support-number{grid-row:1/3;font-size:30px}.support-grid h3{margin:3px 0 6px;font-size:15px}.support-grid p{margin:0;grid-column:2}.relief-guide{padding:22px 18px}.relief-guide dl>div{display:block}.relief-guide dd{margin:7px 0 0 0}.control-list>div{grid-template-columns:1fr;gap:8px;padding:14px 0}.guide-content>.guide-final{padding:25px 20px}.guide-final h2{font-size:23px}}
/* Actual game artwork keeps the reference easy to scan. */
.start-steps .start-icon{display:flex;align-items:center;justify-content:center;width:38px;height:38px;background:#17372c;color:#a7e3d5}.start-icon .ui-icon{width:22px;height:22px}
.recipe-list>li{grid-template-columns:210px minmax(0,1fr);gap:22px}.recipe-result{display:flex;align-items:flex-start;gap:13px}.recipe-result>.guide-skill{width:48px;height:48px;margin:0;flex:none;background-color:#17372c;border-radius:5px}.recipe-result>div{padding-top:4px;min-width:0}.recipe-list .recipe-materials{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-bottom:10px}.material-badge{display:inline-flex;align-items:center;gap:5px;padding:4px 7px 4px 3px;background:#10251e;border:1px solid #95bda338;border-radius:3px}.material-badge>.guide-skill{width:28px;height:28px;margin:0;flex:none}.material-badge>span:last-child{font-size:11px;padding:0;white-space:nowrap;color:#d8e7d4}.recipe-materials .material-plus{font-size:14px;color:#9fb5a6;padding:0}.recipe-materials b{padding-left:3px}
.passive-list>div{grid-template-columns:155px minmax(0,1fr);align-items:center}.passive-list dt{display:flex;align-items:center;gap:10px}.passive-list .guide-skill{width:34px;height:34px;margin:0;flex:none}.support-mark{display:flex;align-items:center;gap:12px}.support-mark>.ui-icon{width:27px;height:27px;color:#a7e3d5}.support-number{font-size:30px}.relief-heading{display:grid;grid-template-columns:135px minmax(0,1fr);align-items:center;gap:25px;margin-bottom:22px}.relief-tower{position:relative;height:180px;display:grid;place-items:center;background:radial-gradient(ellipse,#65d3d822,transparent 70%)}.relief-tower>img{width:180px;height:180px;max-width:none;object-fit:contain;position:relative}.relief-heading .eyebrow{color:#a7e3d5;font-size:9px}.relief-heading p:last-child{margin:0}.relief-guide dt>.ui-icon{color:#a7e3d5;width:20px;height:20px;margin-right:10px}
.guide-boss-art{position:relative;overflow:hidden;margin:8px 0 28px;background:#091915;aspect-ratio:2.6/1}.guide-boss-art>img{display:block;width:100%;height:100%;object-fit:cover;object-position:70% center}.guide-boss-art:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#101a1ceb,transparent 80%)}.guide-boss-art figcaption{position:absolute;z-index:1;left:28px;bottom:28px;color:#f0eee5}.guide-boss-art figcaption>span{display:block;font:9px ui-monospace,monospace;letter-spacing:1px;color:#eac38a;margin-bottom:12px}.guide-boss-art strong{display:block;font-size:22px;letter-spacing:-.5px}.enemy-entry{display:grid;grid-template-columns:160px minmax(0,1fr);align-items:center;gap:20px;padding:17px 0;border-top:1px solid var(--line)}.enemy-pair{display:flex;justify-content:center;gap:10px}.enemy-portrait{display:flex;flex-direction:column;align-items:center;gap:6px;width:75px}.enemy-portrait>span{display:block;width:64px;height:64px;background-size:400% 300%;background-position:33.3333% var(--monster-row);background-repeat:no-repeat;filter:drop-shadow(0 3px 4px #0003)}.enemy-portrait>small{font-size:9px;color:#b8c7ba}.enemy-notes{gap:0}
@media(max-width:1050px){.start-steps li{padding-left:53px}.start-steps .start-icon{top:0}.recipe-list>li{grid-template-columns:1fr;gap:16px}.recipe-result{align-items:center}.recipe-result>div{padding-top:0}.recipe-result h3{margin-bottom:6px}.relief-heading{grid-template-columns:110px minmax(0,1fr);gap:18px}.relief-tower{height:160px}.relief-tower>img{width:160px;height:160px}.support-mark{flex-wrap:wrap;gap:8px}.enemy-entry{grid-template-columns:135px minmax(0,1fr);gap:15px}.enemy-portrait{width:62px}}
@media(max-width:760px){.recipe-list>li>div.recipe-result{display:flex;justify-content:flex-start;align-items:center;gap:13px}.recipe-result>.guide-skill{width:44px;height:44px}.recipe-list h3{margin:0 0 4px}.material-badge{padding-right:5px;gap:3px}.material-badge>span:last-child{font-size:10px}.material-badge>.guide-skill{width:26px;height:26px}.recipe-list .recipe-materials{gap:5px}.recipe-materials b{font-size:9px}.passive-list>div{grid-template-columns:112px minmax(0,1fr);gap:12px}.passive-list dt{gap:6px;font-size:11px}.passive-list .guide-skill{width:28px;height:28px}.support-grid .support-mark{grid-row:1/3;display:flex;flex-direction:column;align-items:flex-start;gap:6px}.support-mark .support-number{font-size:26px}.support-mark>.ui-icon{width:24px;height:24px}.relief-heading{grid-template-columns:75px minmax(0,1fr);gap:17px}.relief-tower{height:150px}.relief-tower>img{width:125px;height:150px}.relief-guide h3{font-size:18px}.relief-heading .eyebrow{font-size:8px;letter-spacing:1px}.guide-boss-art{aspect-ratio:1.45/1}.guide-boss-art figcaption{left:18px;bottom:18px}.guide-boss-art strong{font-size:18px}.guide-boss-art:after{background:linear-gradient(0deg,#101a1cf0,transparent 80%)}.enemy-entry{grid-template-columns:1fr;gap:15px}.enemy-pair{justify-content:flex-start}.enemy-portrait{width:80px}.guide-disclosure>.enemy-notes{padding-bottom:5px}}
.guide-skill:is([data-skill="lightning"],[data-skill="frost"],[data-skill="shield"],.skill-water){background-color:#17372c;border-radius:4px}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
