





:root {
--wrap: 1060px;
--min: 1104px;
}





body:has(.set-wrap) {
--wrap: 1296px;
--min: 1340px;
}





.build-head .core img,
.build-id .cls img,
.entry .node img,
.item img,
.gl-img { border-radius: 6px; }






.build-head {
display: grid;
grid-template-columns: auto minmax(0, 1fr);
align-items: stretch;
gap: 24px;
margin: 8px 0 clamp(24px, calc(3 * var(--vw)), 40px);
padding-bottom: 24px;
border-bottom: 1px solid var(--hair-lit);
}



.build-head .core {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 8px;
max-width: 160px;
}

.build-head .core img {
display: block;
width: 96px;
height: 96px;
border: 2px solid var(--ink);
}

.build-head .by-label {
margin: 4px 0 0;
color: var(--bone-faint);
font-size: 11.5px;
letter-spacing: .08em;
}






.verdict {
margin: 0 0 24px;
padding: 10px 14px;
background: var(--tint-3);
border: 1px solid var(--hair);
border-left: 2px solid var(--c-note);
}




.verdict .by-label {
margin: 0;
color: var(--bone-faint);
font-size: 11.5px;
letter-spacing: .08em;
}


.verdict > p:not(.by-label) { margin: 6px 0 0; color: var(--bone); }

.build-id {
display: flex;
flex-direction: column;
justify-content: center;
gap: 10px;
min-width: 0;
padding-left: 24px;
border-left: 1px solid var(--hair-lit);
}

.build-id h1 {
margin: 0;
color: var(--bone-hi);
font-family: var(--font-cn);
font-size: clamp(28px, calc(3.2 * var(--vw)), 36px);
font-weight: 600;
letter-spacing: .04em;
line-height: 1.15;
}






.build-id .cls {
display: flex;
align-items: center;
gap: 10px;
margin: 0;
color: var(--bone);
font-size: 15px;
}




.build-id .cls > img { flex: none; width: 32px; height: 32px; }

.build-id .season {
margin-left: 4px;
padding-left: 12px;
color: var(--bone-faint);
font-family: var(--font-disp);
font-size: 11px;
letter-spacing: .14em;
border-left: 1px solid var(--hair);
}

.build-id .desc { margin: 0; max-width: 76ch; color: var(--bone-dim); }






#sheet .core > .item {
width: 98px;
aspect-ratio: 1;
min-height: 0;
padding: 0;
place-content: center;



grid-template-columns: minmax(0, 1fr);
gap: 0;
}


.who {
display: inline-flex;
align-items: center;
gap: 8px;
color: var(--bone-hi);
font-weight: 600;
text-decoration: none;
}

a.who:hover { color: var(--accent); }



.facets {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 16px;
}

.facets .tags { margin: 4px 0 0; }




.tags {
display: flex;
flex-wrap: wrap;
gap: 6px;
margin: 0 0 0 auto;
padding: 0;
list-style: none;
}

.tags > li,
.tags > i,
.tagset > button {
padding: 2px 8px;
color: var(--bone-dim);
font-family: var(--font-disp);
font-size: 11.5px;
font-style: normal;
letter-spacing: .08em;
background: var(--tint-2);
border: 1px solid var(--hair);
}




.block { margin-bottom: 20px; }





.slot-row {
display: flex;
align-items: stretch;
gap: 10px;
margin: 0 0 10px;
}

.slot-row:last-child { margin-bottom: 0; }


.slot,
.rig {
min-width: 0;
padding: 8px;
background: var(--tint-1);
border: 1px solid var(--hair);
}









.slot {
display: flex;
flex: var(--n) 1 calc(18px + (var(--n) - 1) * 8px);
flex-direction: column;


gap: 4px;
}

.slot h3 {
display: flex;
align-items: center;
gap: 6px;
margin: 0;
color: var(--bone-dim);
font-family: var(--font-disp);
font-size: 11px;
font-weight: 600;
letter-spacing: .1em;
line-height: 1.4;
}



.slot h3 .slot-tool,
.slot h3 .slot-count { margin-left: auto; }

.slot-count { display: inline-flex; align-items: center; gap: 6px; }
.slot-count b { min-width: 1ch; color: var(--bone-hi); text-align: center; }



.slot-tool,
.slot-count button {
padding: 0 8px;
font: inherit;
line-height: 1.6;
letter-spacing: normal;
}



.gl-img { flex: none; }



.slot h3.art { gap: 10px; font-size: 12.5px; }





.gl {
flex: none;
width: 14px;
height: 14px;
color: var(--bone-dim);
fill: none;
stroke: currentColor;
stroke-width: 1.4;
stroke-linejoin: round;
stroke-linecap: round;
}



.cells {
display: grid;
grid-template-columns: repeat(var(--n), minmax(0, 1fr));
gap: 8px;
margin: 0;
padding: 0;
list-style: none;
}






.slot > .cells { flex: 1; align-content: start; grid-auto-rows: minmax(50px, auto); }



.rig {
display: flex;
flex: var(--n) 1 calc(18px + (var(--c) - 1) * 8px);
gap: 8px;
}








.rig > .item { flex: 1 1 0; min-width: 0; }
.rig > .item.gun { flex: 1.5 1 0; }



.rig .slot-tool { flex: none; align-self: stretch; padding: 0 8px; }













[id$="sec-1"] { --cell: 130px; }

[id$="sec-1"] .slot-row > .slot:first-child { flex: 0 0 calc(26px + 2 * var(--cell)); }


[id$="sec-1"] .slot-row > .slot:nth-child(3) { flex: 0 0 calc(42px + 4 * var(--cell)); }






.slot-row.lead { justify-content: flex-start; }
.slot-row.lead > .slot { flex: 0 1 auto; }
.slot-row.lead .cells { grid-template-columns: repeat(var(--n), minmax(0, 264px)); }






.slot-row.lead > .stats-card { flex: 0 0 auto; }





.item {
position: relative;
display: grid;
grid-template-columns: auto minmax(0, 1fr);
align-items: center;
gap: 8px;
padding: 8px;
color: inherit;
text-decoration: none;
background: var(--tint-2);
border: 1px solid var(--hair);
transition: background .18s ease;
}

.item::after {
content: "";
position: absolute;
inset: 0 auto 0 0;
width: 2px;
background: var(--accent);
opacity: 0;
transition: opacity .18s ease;
}





a.item,
button.item { cursor: pointer; }

a.item:hover,
button.item:hover { background: var(--row-hover); }
a.item:hover::after,
a.item:focus-visible::after,
button.item:hover::after,
button.item:focus-visible::after { opacity: 1; }
a.item:focus-visible,
button.item:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

.item img { display: block; width: 32px; height: 32px; }




.item .nm {
font-size: 11.5px;
line-height: 1.35;
text-wrap: balance;
}



.item .sub {
display: block;
margin-top: 2px;
color: var(--bone-faint);
font-size: 10px;
}


.item .pc {
display: block;
margin-top: 2px;
color: var(--bone-dim);
font-family: var(--font-disp);
font-size: 10px;
letter-spacing: .08em;
}


.item.gun,
.item.gear,
.item.set { padding: 10px; }

.item.gun img,
.item.gear img,
.item.set img { width: 56px; height: 56px; }

.item.gun .nm,
.item.gear .nm,
.item.set .nm { font-size: 13px; }










.pair { display: grid; gap: 4px; }





.pair:has(> .spirits:not([hidden])) { grid-column: span 2; grid-template-columns: auto minmax(120px, 1fr); }
.spirits { display: grid; gap: 4px; align-content: stretch; }
.spirits > .item.gear { padding: 5px 8px; }
.spirits > .item.gear img { width: 24px; height: 24px; }
.spirits > .item.gear .nm { font-size: 11px; }
.spirits > .item.gear.empty { min-height: 34px; }




.ex-perks { flex: 1 1 0; min-width: 0; display: grid; gap: 4px; align-content: stretch; }
.ex-perks > .item.perk-cell.empty { min-height: 34px; }


.item.perk-cell { padding: 8px; }
.item.perk-cell img { width: 24px; height: 24px; }
.item.perk-cell .nm { font-size: 11px; }



.item.move { color: var(--bone-dim); }



.item img { object-fit: cover; }





.stats {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 6px;
margin: 0;
padding: 0;
list-style: none;
}

.stats > li {
display: flex;
align-items: center;
gap: 6px;
padding: 3px 8px;
background: var(--tint-1);
border: 1px solid var(--hair);
}


.stats .val { margin-left: auto; }

.stats .nm {
color: var(--bone-dim);
font-family: var(--font-disp);
font-size: 11px;
letter-spacing: .1em;
}

.stats .gl { width: 16px; height: 16px; }
.stats .val { color: var(--bone-hi); font-family: var(--font-disp); font-size: 13px; }



.stats-card .stats { flex: 1; }














body:has(.entries) { --wrap: 1500px; }






.facet-bar:empty { display: none; }

.facet-bar {
display: flex;
flex-wrap: wrap;
gap: 6px;
align-items: baseline;
justify-content: center;
max-width: var(--wrap);
margin: 0 auto;
padding: 4px 22px 0;
}


.facet-label {
color: var(--bone-faint);
font-family: var(--font-disp);
font-size: 11px;
font-weight: 600;
letter-spacing: .14em;
}


.facet-bar .toggle { font-size: 12.5px; }





.drop {
position: relative;
}




.facet-block {
position: relative;



max-width: var(--wrap);
margin-inline: auto;
}

.facet-tuck {
position: absolute;
top: 4px;
left: 22px;
}


.drop > summary { list-style: none; }
.drop > summary::-webkit-details-marker { display: none; }


.drop > summary > b {
margin-left: 6px;
color: var(--accent);
font-weight: 700;
}

.drop > summary > b:empty { display: none; }





.drop .menu {
position: absolute;
z-index: 6;
top: calc(100% + 6px);

left: 0;
display: flex;
flex-direction: column;
gap: 8px;
width: max-content;
max-width: calc(62 * var(--vw));
padding: 10px 12px;
background: var(--ink-lift);
border: 1px solid var(--hair-lit);
}



.tuck-row {
display: flex;
flex-wrap: wrap;
gap: 6px;
align-items: baseline;
}


.tuck-row > .facet-label {
flex: 0 0 auto;
width: 3.4em;
}


.entries {
grid-template-columns: repeat(5, minmax(0, 1fr));
gap: 16px;
}





.sub-label {
margin: 32px 0 12px;
color: var(--bone-dim);
font-family: var(--font-disp);
font-size: 12px;
font-weight: 600;
letter-spacing: .2em;
}

.sect-label + .sub-label { margin-top: 16px; }
.entries + .sub-label { margin-top: 40px; }









.entries > li { min-width: 0; }

.entries .entry {
display: flex;
flex-direction: column;
align-items: stretch;
gap: 10px;
padding: 16px;
min-width: 0;
}

.entries .entry::after { background: var(--accent); }
.entries .entry:focus-visible { box-shadow: inset 0 0 0 2px var(--accent); }


.entry .node { display: flex; justify-content: center; }


.entry .node img {
display: block;
width: 64px;
height: 64px;
border: 2px solid var(--ink);
}









.entries .entry h3 {
overflow: hidden;
min-width: 0;
margin: 6px 0 0;
font-size: 17px;
line-height: 1.4;
white-space: nowrap;
text-align: center;
text-overflow: ellipsis;
}



.entries .entry .who {
display: flex;
gap: 6px;
align-items: center;
justify-content: center;
color: var(--bone-faint);
font-family: var(--font-disp);
font-size: 11.5px;
letter-spacing: .06em;
}



.entries .entry .verdict {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
margin: 0;
padding: 0 0 0 8px;
background: none;
border: 0;
border-left: 2px solid var(--c-note);
color: var(--c-note);
font-size: 12.5px;
line-height: 1.6;
}

.entries .entry .verdict > b {
margin-right: 6px;
color: var(--bone-dim);
font-family: var(--font-disp);
font-size: 11.5px;
font-weight: 600;
letter-spacing: .08em;
}




.entries .entry .say {
display: flex;
flex-direction: column;
gap: 8px;
height: 112px;
overflow: hidden;
}



.entries .entry .say p {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 5;
overflow: hidden;
margin: 0;
font-size: 12.5px;
line-height: 1.7;
}

.entries .entry .say:has(.verdict) p { -webkit-line-clamp: 3; }







.entries .entry .tags {
gap: 4px;
margin: auto 0 -6px;
height: 22.5px;
align-content: flex-start;
overflow: hidden;
}






.entries .entry .tags > i.sc + i:not(.sc) { margin-left: auto; }

.entries .entry .tags > i {
padding: 1px 5px;
font-size: 10px;
letter-spacing: .04em;
}




.entries .entry .tags > i.sc {
color: var(--bone);
background: var(--tint-3);
}




























:is(.entries .entry, .build-head .core) .node {
position: relative;
--fr: 70px;
}

.build-head .core .node { --fr: 102px; }

:is(.entries .entry, .build-head .core) .node::before,
:is(.entries .entry, .build-head .core) .node::after {
content: "";
position: absolute;
top: 50%;
left: 50%;
width: var(--fr);
height: var(--fr);
border-radius: 9px;
transform: translate(-50%, -50%);
pointer-events: none;
}








[data-tier="meta"] .node::before {
padding: 3px;
background: linear-gradient(115deg, #ff4fd8, #a25cf0, #f0a24a, #bfe4f2, #ff4fd8);
background-size: 300% 300%;
animation: tier-drift 12s ease-in-out infinite;
-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
-webkit-mask-composite: xor;
mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
mask-composite: exclude;
}




[data-tier="meta"] .node::after {
opacity: .85;
box-shadow: 0 0 14px 2px #ff4fd8aa, 0 0 26px #a25cf055;
animation: tier-breathe 3.5s ease-in-out infinite;
}



[data-tier="强力"] .node::before { border: 3px solid #f0a24a; }
[data-tier="强力"] .node::after { box-shadow: 0 0 10px 1px #f0a24a99; }



[data-tier="创意"] .node::before { border: 3px solid #9ec7d8; }
[data-tier="创意"] .node::after { box-shadow: 0 0 8px #9ec7d866; }








.facet-bar[data-facet="强度"] .toggle[data-v="强力"] { color: #f0a24a; }
.facet-bar[data-facet="强度"] .toggle[data-v="创意"] { color: #9ec7d8; }


.facet-bar[data-facet="强度"] .toggle[data-v="meta"] {
color: transparent;
background: linear-gradient(115deg, #ff4fd8, #a25cf0, #f0a24a, #bfe4f2, #ff4fd8);
background-size: 300% 300%;
-webkit-background-clip: text;
background-clip: text;
animation: tier-drift 12s ease-in-out infinite;
}



.facet-bar[data-facet="强度"] .toggle[data-v="meta"]::before,
.facet-bar[data-facet="强度"] .toggle[data-v="meta"]::after { border-color: #ff4fd8; }

.facet-bar[data-facet="强度"] .toggle[data-v][aria-pressed="true"] { font-weight: 600; }

@keyframes tier-drift {
0%, 100% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
}

@keyframes tier-breathe {
0%, 100% { opacity: .6; }
50% { opacity: 1; }
}



.entry-foot {
display: flex;
gap: 8px;
align-items: baseline;
justify-content: space-between;
}

.entries .entry-stamp { margin: 0; }

.entry-foot .likes {
color: var(--bone-faint);
font-family: var(--font-disp);
font-size: 11px;
letter-spacing: .08em;
}


.entry-foot .likes:not(:empty)::before { content: "\2665\FE0E "; }






.id-row {
display: flex;
gap: 24px;
align-items: flex-start;
justify-content: space-between;
}

.head-acts {
display: flex;
flex-shrink: 0;
gap: 8px;
align-items: center;
padding-top: 6px;
}






.head-acts .like b { min-width: 1.4em; font-weight: 600; text-align: left; }


.head-acts .copy[data-tip]::after { content: "　" attr(data-tip); color: var(--accent); }















.src-tools {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 10px;
margin-top: 20px;
padding: 11px 16px;
background: linear-gradient(var(--tint-3), var(--tint-3)), var(--ink-lift);
border: 1px solid var(--bone-faint);
border-top: 2px solid var(--accent);
}



.tool-sep {
align-self: stretch;
width: 1px;
margin: 0 2px;
background: var(--hair-lit);
}






#to-import {
margin-left: auto;
padding: 7px 18px;
color: var(--accent);
font-weight: 600;
border: 1px solid var(--accent);
}

#to-import:hover { color: var(--ink); background: var(--accent); }



#send {
padding: 7px 18px;
color: var(--ink);
font-weight: 600;
background: var(--accent);
}

#send:hover { color: var(--ink); background: var(--accent); }



#send:not([disabled]):hover { background: var(--bone-hi); }



.src-tools :is(.toggle, .op):active { transform: translateY(1px); }

@media (prefers-reduced-motion: reduce) {
.src-tools :is(.toggle, .op):active { transform: none; }
}


#copy-tip {
padding: 0 4px;
color: var(--accent);
font-size: 12.5px;
white-space: nowrap;
}

#copy-tip:empty { display: none; }

#imp-tip { margin: 12px 0 0; color: var(--accent); font-size: 12.5px; }




#sheet.preview .cells > li:not(:has(.item:not(.empty))),
#sheet.preview .rig > .item.empty,
#sheet.preview .ex-perks > .item.empty,
#sheet.preview .ex-perks:not(:has(.item:not(.empty))),
#sheet.preview .pair > .item.empty,
#sheet.preview .slot h3 > .item.empty,
#sheet.preview .slot-tool,
#sheet.preview .slot-count,
#sheet.preview .cls-id .hint,
#sheet.preview .tagset > button:not([aria-pressed="true"]),
#sheet.preview .src-block { display: none; }


#sheet.preview .item,
#sheet.preview .stat,
#sheet.preview input,
#sheet.preview textarea { pointer-events: none; }

#sheet.preview input,
#sheet.preview textarea {
padding-left: 0;
background: none;
border-color: transparent;
}


.new-link {
display: flex;
align-items: baseline;
gap: 12px;
margin: 0;
}

.new-link a {
color: var(--bone-hi);
font-family: var(--font-cn);
font-size: 14px;
text-decoration: none;
}

.new-link a:hover { color: var(--accent); }
.new-link span { color: var(--bone-faint); font-size: 12.5px; }








button.item { width: 100%; }

.item.empty {
grid-template-columns: minmax(0, 1fr);
justify-items: center;
min-height: 50px;
color: var(--bone-faint);
font: inherit;
text-align: center;
background: none;
border: 1px dashed var(--hair-lit);
cursor: pointer;
}

.item.gun.empty,
.item.gear.empty,
.item.set.empty { min-height: 78px; }





.slot h3 > .item {
display: inline-flex;
align-items: center;
gap: 6px;
width: auto;
min-height: 0;
padding: 2px 8px;
font: inherit;
letter-spacing: inherit;
}



.slot h3 > .item.empty {
padding: 6px 14px;
color: var(--bone-hi);
font-family: var(--font-cn);
font-size: 14px;
letter-spacing: .04em;
border-color: var(--accent);
}

.slot h3 > .item::after { content: none; }
.slot h3 > .item img { width: 32px; height: 32px; }
.slot h3 > .item .nm { font-size: inherit; }

.item.empty:hover { color: var(--bone-hi); border-color: var(--accent); }
.item.empty[aria-expanded="true"] { color: var(--bone-hi); border-style: solid; border-color: var(--accent); }


.picker {
margin: 0 0 10px;
padding: 12px;
background: var(--ink-lift);
border: 1px solid var(--accent);
}

.picker-bar { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.picker-bar .tool-search { flex: 1; width: auto; }

.picker-bar .tool-count { min-width: 0; margin: 0; }

.picker-grid {
display: grid;



grid-template-columns: repeat(7, minmax(0, 1fr));
align-content: start;
gap: 8px;
max-height: 336px;
overflow-y: auto;
margin: 0;
padding: 0;
list-style: none;
}

.picker-grid .item { width: 100%; min-height: 58px; padding: 8px; }
.picker-grid .item img { width: 28px; height: 28px; }



.picker-grid.art .item { min-height: 62px; }


.picker-grid .item .kd { grid-column: 1 / -1; color: var(--bone-faint); font-size: 10px; }










.dpanel {
margin: 10px 0 0;
padding: 12px 14px;
background: var(--tint-2);
border: 1px solid var(--hair);
border-left: 2px solid var(--accent);
}


.slot-row + .dpanel, .block + .dpanel, .build-head + .dpanel { margin: 0 0 10px; }

.dp-name {
margin: 0 0 8px;
color: var(--bone-hi);
font-family: var(--font-cn);
font-size: 14px;
font-weight: 600;
letter-spacing: .04em;
}

.dp-name .sub { margin-left: 8px; color: var(--bone-faint); font-size: 11.5px; font-weight: 400; }

.dp-body { color: var(--bone-dim); font-size: 12.5px; line-height: 1.85; }
.dp-body p { margin: 0 0 8px; }
.dp-body p:last-child { margin-bottom: 0; }


.dp-body p.v {
padding-bottom: 6px;
color: var(--bone);
font-family: var(--font-disp);
font-size: 12px;
border-bottom: 1px solid var(--hair);
}


.dp-body p.bn { color: var(--bone-hi); font-weight: 600; }


#sheet input,
#sheet textarea {
color: var(--bone-hi);
font: inherit;
background: var(--tint-2);
border: 1px solid var(--hair);
}

#sheet input { padding: 6px 10px; }
#sheet textarea { display: block; width: 100%; padding: 10px 12px; line-height: 1.8; }
#sheet :focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }




.ink-box { position: relative; display: block; }

.ink-box > .ink {
position: absolute;
inset: 0;
overflow: hidden;
white-space: pre-wrap;
overflow-wrap: break-word;
pointer-events: none;
border-style: solid;
border-color: transparent;
}

.ink-box > input + .ink { white-space: pre; }
.inked::placeholder { color: var(--bone-faint); }

#sheet h1 input,
#sheet .one-head h2 input {
width: 100%;
padding: 4px 10px;
font-family: var(--font-cn);
font-size: inherit;
font-weight: 600;
letter-spacing: .04em;
}

#sheet .cls { flex-wrap: wrap; }




.tagset > button {
font-family: var(--font-disp);
line-height: 1.6;
cursor: pointer;
}




.tagset > button { border-color: var(--hair-lit); }

.tagset > button:hover { color: var(--bone-hi); }
.tagset > button[aria-pressed="true"] {
color: var(--bone-hi);
border-color: var(--accent);
}


#sheet .who-in {
width: 100%;
color: var(--bone-hi);
font-family: var(--font-cn);
font-size: 13px;
font-weight: 600;
}


#sheet .cls-id { display: inline-flex; align-items: center; gap: 10px; }
#sheet .cls-id .hint { color: var(--bone-faint); font-size: 12.5px; }
#sheet .desc input { width: 100%; }



#sheet .desc { max-width: none; }


#sheet .stats { grid-template-columns: repeat(3, 130px); }
#sheet .stats > li { padding: 0; }

#sheet .stats .stat {
display: flex;
flex: 1;
align-items: center;
gap: 6px;
padding: 3px 8px;
color: inherit;
font: inherit;
background: none;
border: 0;
cursor: pointer;
}

#sheet .stats .stat:hover .val { color: var(--accent); }


.stat-picker .picker-bar { flex-wrap: wrap; }
.stat-picker .tool-count { flex: none; color: var(--bone); }

.stat-picker .stat-num {
width: 78px;
text-align: center;
appearance: textfield;
}

.stat-picker .stat-num::-webkit-outer-spin-button,
.stat-picker .stat-num::-webkit-inner-spin-button {
margin: 0;
appearance: none;
}


#src > summary,
#imp > summary {
color: var(--bone-dim);
font-family: var(--font-cn);
font-size: 13px;
cursor: pointer;
}

#src > summary:hover,
#imp > summary:hover { color: var(--bone-hi); }




#sheet #out,
#sheet #in {
display: block;
width: 100%;
margin-top: 12px;
padding: 10px 12px;
color: var(--bone-hi);
font: 400 13px/1.7 var(--font-body);
background: var(--tint-2);
border: 1px solid var(--hair);
}



#imp .note { margin: 0 0 10px; color: var(--bone-dim); font-size: 12.5px; }





.set-wrap {
display: grid;
grid-template-columns: 208px minmax(0, 1fr);
gap: 28px;
align-items: start;
}







.set-list {
position: sticky;
grid-row: 1 / -1;
top: calc(var(--stick) + 16px);
min-width: 0;
}



.set-wrap > .src-block,
.set-wrap > .src-tools { grid-column: 2; }

.set-list > .by-label {
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
margin: 0 0 10px;
}






.viewsw {
padding: 3px 10px;
font: inherit;
font-size: 11.5px;
background: none;
}

.set-list ol {
counter-reset: seat;
display: flex;
flex-direction: column;
gap: 6px;
margin: 0;
padding: 0;
list-style: none;
}

.set-list li { counter-increment: seat; }






.set-list a,
.set-list button[data-go] {
position: relative;
display: grid;
grid-template-columns: auto minmax(0, 1fr);
gap: 4px 10px;
align-items: center;
padding: 8px 10px 8px 13px;
color: inherit;
text-decoration: none;
background: var(--tint-1);
border: 1px solid var(--hair);
}








.core-mosaic {
display: flex;
flex-wrap: wrap;
align-content: center;
justify-content: center;
gap: 2px;
width: var(--sz);
height: var(--sz);
}




.build-head .core .core-mosaic img,
.entry .node .core-mosaic img {
width: var(--tile);
height: var(--tile);
}

.set-list a::before,
.set-list button[data-go]::before {
content: "";
position: absolute;
inset: 0 auto 0 0;
width: 2px;
background: var(--accent);
}

.set-list a:has(img),
.set-list button[data-go]:has(img) {
grid-template-columns: auto auto minmax(0, 1fr);
}

.set-list img {
display: block;
width: 32px;
height: 32px;
border: 1px solid var(--hair);
}



.set-list .who {
display: flex;
flex-direction: column;
gap: 2px;
grid-row: span 2;
align-self: center;
color: var(--bone-faint);
font-size: 11px;
font-style: normal;
white-space: nowrap;
}

.set-list .who em { font-style: normal; }

.set-list b {
display: block;
color: var(--bone);
font-family: var(--font-cn);
font-size: 13px;
font-weight: 600;
}

.set-list b::before { content: counter(seat) "　"; color: var(--bone-faint); }

.set-list span {
display: block;
overflow: hidden;
color: var(--bone-faint);
font-size: 11.5px;
white-space: nowrap;
text-overflow: ellipsis;
}

.set-list a:hover,
.set-list button[data-go]:hover { background: var(--row-hover); }

.set-list a:focus-visible,
.set-list button[data-go]:focus-visible {
outline: 2px solid var(--accent);
outline-offset: 2px;
}

.set-list [aria-current="true"] {
background: var(--tint-2);
border-color: var(--accent);
}

.set-list [aria-current="true"] b { color: var(--bone-hi); }



.set-list img { grid-row: span 2; }
.set-list b,
.set-list span { grid-column: -2 / -1; }

.set-list button[data-go] {
width: 100%;
font: inherit;
text-align: left;
cursor: pointer;
}




.set-add {
display: block;
width: 100%;
margin-top: 6px;
padding: 12px 0;
color: var(--bone-faint);
font: inherit;
font-size: 20px;
line-height: 1;
text-align: center;
background: none;
border: 1px dashed var(--hair-lit);
cursor: pointer;
}

.set-add:hover { color: var(--bone-hi); border-color: var(--accent); }
.set-add:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.set-add[disabled] { opacity: .35; cursor: default; }
.set-add[disabled]:hover { color: var(--bone-faint); border-color: var(--hair-lit); }



.set-list li { position: relative; }

.set-drop {
position: absolute;
top: 2px;
right: 2px;
width: 20px;
height: 20px;
padding: 0;
color: var(--bone-faint);
font: inherit;
font-size: 14px;
line-height: 1;
background: none;
border: 0;
opacity: 0;
cursor: pointer;
transition: opacity .18s ease;
}

.set-list li:hover .set-drop,
.set-drop:focus-visible { opacity: 1; }
.set-drop:hover { color: var(--bone-hi); }
.set-drop:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }



.set-list li[draggable="true"] { cursor: grab; }
.set-list li.dragging { opacity: .4; }
.set-list li.drop-before::before,
.set-list li.drop-after::after {
content: "";
position: absolute;
left: 0;
right: 0;
height: 2px;
background: var(--accent);
pointer-events: none;
}
.set-list li.drop-before::before { top: -5px; }
.set-list li.drop-after::after { bottom: -5px; }
















.one-head .item.one-core {
flex: none;
width: 48px;
aspect-ratio: 1;
min-height: 0;
padding: 0;
place-content: center;
justify-items: center;
grid-template-columns: minmax(0, 1fr);
gap: 0;
}

.one-head .item.one-core .nm { font-size: 10.5px; }





#sheet .id-row > h1,
#sheet .one-head h2 { flex: 1; min-width: 0; }




.set-one {
content-visibility: auto;
contain-intrinsic-height: auto 2400px;
scroll-margin-top: calc(var(--stick) + 16px);
}

.set-one + .set-one {
margin-top: 32px;
padding-top: 28px;
border-top: 1px solid var(--hair-lit);
}



.one-head {
display: flex;
flex-direction: column;
gap: 8px;
margin-bottom: 18px;
}

.one-head h2 {
margin: 0;
color: var(--bone-hi);
font-family: var(--font-cn);
font-size: 22px;
font-weight: 600;
letter-spacing: .04em;
}

.one-head .cls {
display: flex;
align-items: center;
gap: 8px;
margin: 0;
color: var(--bone);
font-size: 13px;
}

.one-head .cls > img { flex: none; width: 24px; height: 24px; }
.one-head .desc { margin: 0; max-width: 76ch; color: var(--bone-dim); }



.n-sets {
position: absolute;
top: 10px;
right: 10px;
padding: 2px 7px;
color: var(--accent);
font-family: var(--font-disp);
font-size: 11px;
letter-spacing: .1em;
background: var(--tint-2);
border: 1px solid var(--hair);
}
