.cmp-area{padding-top:20px}.cmp{--cmp-mid:176px;display:grid;grid-template-columns:minmax(0, 1fr) var(--cmp-mid) minmax(0, 1fr)}.cmp>*{min-width:0}.cmp>.is-a{padding-right:24px}.cmp>.is-b{padding-left:24px}.cmp>.is-d{border-inline:1px solid var(--line-soft)}.cmp-pick{position:relative;display:flex;align-items:center;height:48px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--glass-field);transition:border-color var(--dur-hover)}.cmp-pick:hover,.cmp-pick:focus-within{border-color:var(--brand-accent)}.cmp-top[style*="--race-color"] .cmp-pick:hover,.cmp-top[style*="--race-color"] .cmp-pick:focus-within{border-color:var(--race-color)}.cmp-pick .cmp-pick-mark{position:absolute;left:14px;top:50%;width:26px;height:26px;transform:translateY(-50%);color:var(--race-color, var(--ink));pointer-events:none}.cmp-pick .cmp-pick-mark svg{width:100%;height:100%;display:block}.cmp-pick select{appearance:none;width:100%;height:100%;padding:0 48px 0 56px;border:0;background:none;font:inherit;font-family:var(--heading);font-size:var(--fs-item);font-weight:500;letter-spacing:.3px;color:var(--ink);cursor:pointer}.cmp-pick select:focus-visible{outline:none}.cmp-pick select option{background:var(--surface-tip);color:var(--ink);font-family:var(--text);font-size:var(--fs-name)}.cmp-pick>svg{position:absolute;right:16px;top:50%;width:16px;height:16px;transform:translateY(-50%);fill:none;stroke:var(--ink-muted);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}.cmp-top,.cmp-head{margin-bottom:16px}.cmp-head{display:grid;place-items:center;height:48px;font-family:var(--heading);font-size:var(--fs-group);font-weight:500;letter-spacing:3px;text-transform:uppercase;color:var(--ink-dim)}.cmp-label{display:flex;align-items:flex-end;height:64px;margin:0;padding-bottom:12px;border-bottom:1px solid var(--line-soft);font-family:var(--heading);font-size:var(--fs-group);font-weight:500;letter-spacing:3px;text-transform:uppercase;color:var(--ink)}.cmp-cell{display:flex;align-items:center;gap:12px;min-height:48px;padding:8px 0;border-bottom:1px solid var(--line-soft);font-size:var(--fs-name);line-height:var(--lh-snug);color:var(--ink-dim)}.cmp-name{flex:1;min-width:0;color:var(--ink)}.cmp-name::first-letter{text-transform:uppercase}.cmp-val{flex:none;min-width:72px;font-family:var(--heading);font-size:var(--fs-item);font-weight:500;text-align:right;color:var(--ink-dim);transition:color var(--dur-hover)}.cmp-cell.is-more .cmp-val{color:var(--ink);text-decoration:underline 2px var(--accent);text-underline-offset:6px}.cmp-cell.is-more .cmp-name{color:var(--ink)}.cmp-val.is-none{color:var(--ink-faint)}.cmp-val.is-minus{color:var(--stat-health)}.cmp-dot{flex:none;width:6px;height:6px;border-radius:50%;background:var(--dot, var(--ink-faint))}.cmp-ico{flex:none;width:18px;height:18px;background:var(--ink-muted);-webkit-mask:var(--fx-icon) center / contain no-repeat;mask:var(--fx-icon) center / contain no-repeat}.cmp-cell.is-empty .cmp-name{color:var(--ink-faint)}.cmp-cell.is-diff{justify-content:center;gap:10px;color:var(--ink-muted)}.cmp-cell.is-diff svg{width:18px;height:18px;fill:none;stroke:var(--accent);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.cmp{animation:rb-in var(--dur-open) var(--ease) both}.cmp-cell.is-diff b{font-family:var(--heading);font-size:var(--fs-plate);font-weight:500;color:var(--ink)}.cmp-cell.is-diff.is-same{color:var(--ink-faint)}.cmp-cell.is-diff.is-same b{color:var(--ink-faint)}.cmp-icon-passive{--fx-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='black' stroke-width='1.4' stroke-linejoin='round'%3E%3Cpath d='M10 2.2c.8 5 2.8 7 7.8 7.8-5 .8-7 2.8-7.8 7.8-.8-5-2.8-7-7.8-7.8 5-.8 7-2.8 7.8-7.8z'/%3E%3C/svg%3E")}.cmp-icon-trait{--fx-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='black' stroke-width='1.4' stroke-linejoin='round'%3E%3Cpath d='M10 3.2 16.8 10 10 16.8 3.2 10z'/%3E%3C/svg%3E")}.cmp-icon-value{--fx-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='3.4'/%3E%3C/svg%3E")}.cmp-icon-skill{--fx-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='black' stroke-width='1.4' stroke-linecap='round'%3E%3Cpath d='M4.4 15.6 15.6 4.4M11.6 4.4h4v4M6.4 11.6l2 2M3.6 16.4l1.6-1.6'/%3E%3C/svg%3E")}.cmp-icon-bg{--fx-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='black' stroke-width='1.4' stroke-linejoin='round'%3E%3Cpath d='M5 2.8h7.2l3.4 3.4v11H5z'/%3E%3Cpath d='M12.2 2.8v3.4h3.4'/%3E%3C/svg%3E")}.cmp-ico.is-tint{background:var(--element, var(--ink-muted))}a.cmp-name{text-decoration:none;transition:color var(--dur-hover)}a.cmp-name:hover{color:var(--accent)}.cmp-bonus{flex:none;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:4px}.cmp-bonus small{padding:2px 6px;border-radius:999px;font-size:var(--fs-hint);font-weight:600}.cmp-key{display:block;margin-bottom:2px;font-size:var(--fs-hint);font-weight:600;letter-spacing:1px;text-transform:uppercase;color:var(--ink-muted)}.cmp-rec.is-none{color:var(--ink-faint)}.cmp-note{display:block;margin-top:2px;font-size:var(--fs-hint);color:var(--ink-muted)}.cmp-mark{flex:none;width:20px;height:20px}.cmp-mark svg{width:100%;height:100%;display:block}.cmp-cell.cmp-actions{padding-top:16px;border-bottom:0}@media (max-width:1100px){.cmp{--cmp-mid:112px}.cmp>.is-a{padding-right:16px}.cmp>.is-b{padding-left:16px}}@media (max-width:760px){.cmp{--cmp-mid:64px}.cmp>.is-a{padding-right:10px}.cmp>.is-b{padding-left:10px}.cmp-pick{height:44px}.cmp-pick .cmp-pick-mark{display:none}.cmp-pick select{padding:0 32px 0 12px;font-size:var(--fs-name)}.cmp-pick>svg{right:10px}.cmp-head{font-size:var(--fs-micro);letter-spacing:1px}.cmp-label{height:48px;font-size:var(--fs-micro);letter-spacing:1.6px}.cmp-cell{flex-wrap:wrap;gap:2px 8px;min-height:56px;font-size:var(--fs-ui)}.cmp-cell .cmp-dot,.cmp-cell .cmp-ico{display:none}.cmp-name{flex-basis:100%}.cmp-bonus{flex:1 1 100%;min-width:0;justify-content:flex-start}.cmp-val{min-width:0;text-align:left;font-size:var(--fs-name)}.cmp-cell.is-diff{flex-direction:column;gap:2px}}